[data-media-feature] .form-row label { display: block; width: 100%; }
[data-media-feature] textarea { display: block; width: 100%; min-height: 110px; margin-top: 6px; padding: 12px; border: 1px solid #d8d5e3; border-radius: 10px; font: inherit; resize: vertical; box-sizing: border-box; }
[data-media-feature] p { margin: 12px 0; line-height: 1.6; }
[data-media-feature] h3 { margin: 24px 0 12px; }
[data-media-feature] fieldset { display: grid; gap: 9px; margin-top: 18px; padding: 14px; border: 1px solid #dedbe7; border-radius: 12px; }
[data-media-feature] input[type=checkbox] { width: auto; margin-right: 8px; }
[data-media-feature] td small { display: block; max-width: 260px; overflow-wrap: anywhere; margin-top: 6px; }
[data-media-feature] [role=status] { font-weight: 600; }
[data-media-feature] hr { margin: 28px 0; border: 0; border-top: 1px solid #dedbe7; }
.campaign-builder { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(320px,.65fr); gap: 28px; align-items: start; }
.campaign-fields { min-width: 0; }
.campaign-authorization { display: flex; align-items: center; gap: 6px; margin: 14px 0; }
.campaign-submit { display: flex; align-items: center; gap: 14px; margin-top: 22px; }
.campaign-submit [role=status] { margin: 0; }
.campaign-preview { position: sticky; top: 18px; padding: 16px; border: 1px solid #dedbe7; border-radius: 18px; background: linear-gradient(145deg,#f8f7fc,#fff); color: #201738; }
.campaign-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.campaign-preview-heading > div { display: grid; gap: 3px; min-width: 0; }
.campaign-preview-heading span:first-child { color: #756c86; font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.campaign-preview-heading strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.campaign-preview-channel { flex: 0 0 auto; padding: 6px 9px; border-radius: 999px; background: #e7f8ef; color: #178856 !important; font-size: 10px !important; letter-spacing: 0 !important; }
.campaign-phone { overflow: hidden; border: 7px solid #1d1830; border-radius: 28px; background: #efe9e1; box-shadow: 0 18px 40px rgba(32,23,56,.18); }
.campaign-phone-bar { display: flex; align-items: center; gap: 10px; padding: 12px 13px; background: #075e54; color: white; }
.campaign-phone-bar > div { display: grid; min-width: 0; margin-right: auto; }
.campaign-phone-bar b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.campaign-phone-bar small { color: rgba(255,255,255,.72); font-size: 9px; }
.campaign-chat { min-height: 390px; padding: 22px 12px; background-color: #efe7dd; background-image: radial-gradient(rgba(86,69,54,.08) 1px,transparent 1px); background-size: 13px 13px; }
.campaign-bubble { display: grid; gap: 9px; width: min(88%,330px); margin-left: auto; padding: 7px; border-radius: 12px 2px 12px 12px; background: #d9fdd3; box-shadow: 0 2px 5px rgba(60,43,30,.13); }
.campaign-bubble > p { margin: 0; padding: 0 4px; color: #1d2925; font-size: 12px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.campaign-bubble > a { padding: 0 4px; color: #0875c1; font-size: 11px; line-height: 1.35; overflow-wrap: anywhere; text-decoration: underline; }
.campaign-preview-media { display: grid; gap: 5px; overflow: hidden; border-radius: 8px; }
.campaign-media-empty { display: grid; place-items: center; min-height: 185px; padding: 18px; background: linear-gradient(145deg,#e6e1ee,#f6f4f8); color: #695f79; text-align: center; }
.campaign-media-empty span { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 8px; border-radius: 50%; background: rgba(255,255,255,.75); color: #6d28d9; }
.campaign-media-empty b { font-size: 12px; }
.campaign-media-empty small { margin-top: 3px; color: #837990; font-size: 9px; }
.campaign-media-item { position: relative; min-height: 90px; background: #17131f; }
.campaign-media-item img, .campaign-media-item video { display: block; width: 100%; max-height: 270px; object-fit: contain; }
.campaign-media-item > span { position: absolute; left: 7px; bottom: 7px; padding: 4px 7px; border-radius: 999px; background: rgba(0,0,0,.7); color: white; font-size: 9px; }
.campaign-preview-time { justify-self: end; padding: 0 4px 2px; color: #65746d; font-size: 9px; }
.campaign-preview-note { margin: 12px 2px 0 !important; color: #756c86; font-size: 10px; text-align: center; }
.media-report-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 14px; margin: 18px 0; }
.media-report-toolbar label { display: grid; gap: 6px; font-weight: 700; }
.media-report-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin: 18px 0 24px; }
.media-report-kpis > div { display: grid; gap: 5px; min-width: 0; padding: 16px; border: 1px solid #dedbe7; border-radius: 14px; background: linear-gradient(145deg,#faf9fd,#fff); }
.media-report-kpis span { color: #756c86; font-size: 11px; font-weight: 700; }
.media-report-kpis b { color: #251a3f; font-size: 26px; }
.media-report-kpis small { overflow: hidden; color: #756c86; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.campaign-ranking { margin: 24px 0; padding: 18px; border: 1px solid #c9b8f2; border-radius: 18px; background: linear-gradient(145deg,#fbf9ff,#fffaf5); }
.campaign-ranking-heading { display: flex; align-items: start; justify-content: space-between; gap: 18px; }
.campaign-ranking-heading h3 { margin: 0 0 6px; color: #3d2174; font-size: 18px; }
.campaign-ranking-heading p { margin: 0; color: #655d73; }
.campaign-ranking-total { flex: 0 0 auto; padding: 7px 11px; border: 1px solid #b99cec; border-radius: 999px; background: #eee7ff; color: #51279a; font-size: 11px; font-weight: 800; }
.campaign-ranking-filters { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin: 18px 0 12px; }
.campaign-ranking-search { display: grid; flex: 1 1 420px; gap: 6px; max-width: 620px; color: #35284b; font-size: 11px; font-weight: 800; }
.campaign-ranking-search input { width: 100%; min-height: 42px; padding: 10px 12px; border: 1px solid #a98bdc; border-radius: 11px; background: white; color: #241839; font: inherit; }
.campaign-ranking-check { display: flex; align-items: center; gap: 4px; min-height: 42px; color: #4b3d5e; font-size: 11px; font-weight: 750; white-space: nowrap; }
.campaign-ranking-table { max-height: none; border: 1px solid #d8c9f1; border-radius: 13px; background: white; }
.campaign-ranking-table table { table-layout: fixed; min-width: 860px; }
.campaign-ranking-table th:nth-child(1) { width: 72px; }
.campaign-ranking-table th:nth-child(2) { width: 42%; }
.campaign-ranking-table td { vertical-align: middle; }
.campaign-rank { display: inline-grid; place-items: center; min-width: 38px; height: 28px; border-radius: 999px; background: #eee7ff; color: #6936c6; font-size: 11px; font-weight: 900; }
.campaign-name { display: block; overflow: hidden; color: #33204f; font-size: 12px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.campaign-clicks { color: #e96b0b; font-size: 16px; }
.campaign-ranking-pagination { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 12px; color: #655d73; font-size: 11px; font-weight: 750; }
.campaign-ranking-pagination > div { display: flex; gap: 8px; }
.campaign-ranking-pagination .button { min-width: 88px; }
.media-report-details { margin: 20px 0; }
.media-report-details summary { cursor: pointer; color: #4e287f; font-weight: 800; }
.media-report-details .table-wrap { margin-top: 12px; }
.media-report-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 20px; }
.media-report-grid > section { padding: 16px; border: 1px solid #dedbe7; border-radius: 14px; }
@media (max-width: 1050px) { .campaign-builder { grid-template-columns: 1fr; } .campaign-preview { position: static; max-width: 520px; } }
@media (max-width: 1050px) { .media-report-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 700px) { .media-report-grid { grid-template-columns: 1fr; } .campaign-ranking-heading, .campaign-ranking-filters { align-items: stretch; flex-direction: column; } .campaign-ranking-search { flex-basis: auto; max-width: none; } .campaign-ranking-check { min-height: auto; } }
@media (max-width: 580px) { .campaign-preview { padding: 10px; } .campaign-chat { min-height: 330px; } .campaign-submit, .media-report-toolbar { align-items: stretch; flex-direction: column; } .media-report-kpis { grid-template-columns: 1fr; } }
