/* =====================================================================
   French Daina admin — compact, WordPress-style backend
   Charcoal sidebar + slim dark top bar, light grey workspace, dense lists
   ===================================================================== */
:root {
  --fd-bar: #1d2327;          /* sidebar + top bar (WordPress charcoal) */
  --fd-bar-2: #2c3338;        /* hover */
  --fd-bar-3: #101517;        /* sub-menu / deeper */
  --fd-bar-text: #c3c4c7;
  --fd-bar-muted: #8c8f94;
  --fd-accent: #2563eb;
  --fd-accent-2: #1d4ed8;
  --fd-bg: #f0f2f5;
  --fd-card: #ffffff;
  --fd-line: #dfe3ea;
  --fd-ink: #1d2327;
  --fd-body: #50575e;
  --fd-ok: #00a32a;
  --fd-warn: #dba617;
  --fd-bad: #d63638;
  --fd-topbar-h: 3.25rem;
}
html.dark {
  --fd-bg: #0f1115;
  --fd-card: #171a20;
  --fd-line: #2a2f38;
  --fd-ink: #eef0f3;
  --fd-body: #a7adb7;
  --fd-bar: #0b0d10;
  --fd-bar-2: #1a1e24;
  --fd-bar-3: #05070a;
}

/* ---------- Density: everything ~10% smaller, like wp-admin ---------- */
html { font-size: 14.5px; }
body.fi-body { background: var(--fd-bg) !important; color: var(--fd-ink); -webkit-font-smoothing: antialiased; }
.fi-main { padding-top: 1.25rem !important; }
.fi-header { gap: .5rem !important; }
.fi-header-heading { font-size: 1.6rem !important; letter-spacing: -.02em; font-weight: 800 !important; }
.fi-header-subheading { font-size: .95rem !important; margin-top: .15rem !important; }
.fi-breadcrumbs { font-size: .8rem; }

/* ---------- Sidebar ---------- */
.fi-sidebar.fi-main-sidebar { background: var(--fd-bar) !important; border-right: 0 !important; box-shadow: none !important; }
.fi-sidebar .fi-sidebar-header { background: var(--fd-bar) !important; border-bottom: 1px solid rgba(255,255,255,.06) !important; box-shadow: none !important; height: var(--fd-topbar-h) !important; }
.fi-sidebar .fi-sidebar-nav { padding: .75rem .6rem 1.5rem !important; row-gap: .9rem !important; }
.fi-sidebar .fi-sidebar-group-label { color: var(--fd-bar-muted) !important; text-transform: uppercase; font-size: .66rem !important; letter-spacing: .1em; font-weight: 700 !important; }
.fi-sidebar .fi-sidebar-group-btn { padding-block: .2rem !important; }
.fi-sidebar .fi-sidebar-group-btn svg, .fi-sidebar .fi-sidebar-group-collapse-btn svg { color: var(--fd-bar-muted) !important; }
.fi-sidebar .fi-sidebar-group-items { row-gap: 1px !important; }
.fi-sidebar .fi-sidebar-item-btn { border-radius: 6px !important; padding: .42rem .6rem !important; gap: .65rem !important; }
.fi-sidebar .fi-sidebar-item-label { color: var(--fd-bar-text) !important; font-weight: 500 !important; font-size: .9rem !important; }
.fi-sidebar .fi-sidebar-item-icon { color: var(--fd-bar-muted) !important; width: 1.15rem !important; height: 1.15rem !important; }
.fi-sidebar .fi-sidebar-item-btn:hover { background: var(--fd-bar-2) !important; }
.fi-sidebar .fi-sidebar-item-btn:hover .fi-sidebar-item-label,
.fi-sidebar .fi-sidebar-item-btn:hover .fi-sidebar-item-icon { color: #72aee6 !important; }
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background: var(--fd-accent) !important; }
.fi-sidebar .fi-sidebar-item.fi-active .fi-sidebar-item-label,
.fi-sidebar .fi-sidebar-item.fi-active .fi-sidebar-item-icon { color: #fff !important; }
.fi-sidebar .fi-sidebar-item-grouped-border-part { background: rgba(255,255,255,.12) !important; }
.fi-sidebar .fi-badge { box-shadow: none !important; font-size: .68rem !important; padding: .05rem .45rem !important; min-width: 1.3rem; justify-content: center; }
.fi-sidebar .fi-badge.fi-color-danger, .fi-sidebar .fi-badge.fi-color-warning { background: var(--fd-bad) !important; color: #fff !important; }
.fi-sidebar ::-webkit-scrollbar { width: 6px; } .fi-sidebar ::-webkit-scrollbar-thumb { background: #3c434a; border-radius: 6px; }

/* ---------- Slim dark top bar ---------- */
.fi-topbar-ctn { box-shadow: none !important; }
.fi-topbar { background: var(--fd-bar) !important; border-bottom: 0 !important; box-shadow: none !important; min-height: var(--fd-topbar-h) !important; height: var(--fd-topbar-h); color: var(--fd-bar-text); }
.fi-topbar button, .fi-topbar .fi-icon-btn { color: var(--fd-bar-text) !important; }
.fi-topbar .fi-global-search-field input, .fi-topbar .fi-input-wrp { background: var(--fd-bar-2) !important; border-color: transparent !important; color: #fff !important; box-shadow: none !important; }
.fi-topbar .fi-input-wrp input { color: #fff !important; }
.fi-topbar .fi-input-wrp input::placeholder { color: var(--fd-bar-muted) !important; }
.fi-topbar .fi-input-wrp svg { color: var(--fd-bar-muted) !important; }
.fi-topbar .fi-user-menu .fi-avatar { width: 1.9rem !important; height: 1.9rem !important; box-shadow: 0 0 0 2px #3c434a; }

.fd-topbar-actions { display: flex; align-items: center; gap: .35rem; margin-inline-end: .5rem; font-size: .85rem; }
.fd-topbar-actions .fd-ic { width: 1.05rem; height: 1.05rem; flex: none; }
.fd-dd { position: relative; }
.fd-dd > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: .35rem; padding: .35rem .65rem; border-radius: 6px; color: var(--fd-bar-text); font-weight: 600; user-select: none; }
.fd-dd > summary::-webkit-details-marker { display: none; }
.fd-dd > summary:hover, .fd-dd[open] > summary { background: var(--fd-bar-2); color: #fff; }
.fd-new { background: var(--fd-accent); color: #fff !important; }
.fd-new:hover, .fd-dd[open] > .fd-new { background: var(--fd-accent-2) !important; }
.fd-bell { position: relative; }
.fd-bell-count { position: absolute; top: 0; right: 0; transform: translate(30%, -25%); background: var(--fd-bad); color: #fff; border-radius: 999px; font-size: .62rem; font-weight: 800; padding: .05rem .35rem; line-height: 1.3; border: 2px solid var(--fd-bar); }
.fd-dd-menu { position: absolute; top: calc(100% + .4rem); left: 0; z-index: 60; min-width: 13rem; background: var(--fd-card); border: 1px solid var(--fd-line); border-radius: 10px; box-shadow: 0 12px 32px rgba(0,0,0,.18); padding: .35rem; display: grid; }
.fd-bell + .fd-dd-menu, .fd-dd-wide { left: auto; right: 0; min-width: 19rem; }
.fd-dd-menu a { display: flex; align-items: center; gap: .6rem; padding: .5rem .65rem; border-radius: 6px; color: var(--fd-ink); text-decoration: none; font-weight: 500; }
.fd-dd-menu a:hover { background: color-mix(in srgb, var(--fd-accent) 10%, transparent); color: var(--fd-accent); }
.fd-dd-menu .fd-ic { color: var(--fd-body); }
.fd-dd-title { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--fd-body); padding: .45rem .65rem .25rem; margin: 0; }
.fd-dd-empty { display: flex; gap: .5rem; align-items: center; padding: .6rem .65rem; color: var(--fd-ok); margin: 0; }

.fd-view-site { display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .65rem; border-radius: 6px; font-weight: 600; color: var(--fd-bar-text); text-decoration: none; }
.fd-view-site:hover { background: var(--fd-bar-2); color: #fff; }
.fd-signed-in { display: flex; align-items: center; gap: .5rem; white-space: nowrap; color: var(--fd-bar-text); padding-inline: .4rem; }
.fd-signed-in .fd-name { font-weight: 600; color: #fff; }
.fd-role { background: rgba(114,174,230,.16); color: #9ec9f2; font-weight: 700; font-size: .68rem; padding: .15rem .5rem; border-radius: 999px; letter-spacing: .02em; }
@media (max-width: 1100px) { .fd-signed-in .fd-name, .fd-view-site span { display: none; } }
@media (max-width: 640px) { .fd-signed-in { display: none; } .fd-new { padding-inline: .5rem !important; } }

/* Brand block (top-left) */
.fd-brand { display: inline-flex; align-items: center; gap: .5rem; }
.fd-brand-mark { display: grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: .45rem; background: var(--fd-accent); color: #fff; font-weight: 800; font-size: .95rem; }
.fd-brand-name { font-weight: 800; font-size: .92rem; letter-spacing: -.01em; color: #fff; white-space: nowrap; }
.fd-brand-name b, .fd-brand-tag { font-weight: 700; color: #72aee6; margin-left: .3rem; }
.fd-brand-img { height: 1.75rem; width: auto; max-width: 9rem; object-fit: contain; filter: drop-shadow(0 0 0 transparent); }
.fd-brand-tag { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }
@media (min-width: 1024px) {
  .fi-topbar { padding-inline-start: 0 !important; }
  .fi-topbar-start { background: var(--fd-bar-3); align-self: stretch; width: 15rem; padding-inline: .9rem !important; }
  body:has(.fi-sidebar:not(.fi-sidebar-open)) .fi-topbar-start { width: auto; }
}

/* ---------- Cards / sections ---------- */
.fi-section { border-radius: 10px !important; box-shadow: 0 1px 2px rgba(16,24,40,.05) !important; border: 1px solid var(--fd-line) !important; background: var(--fd-card) !important; --tw-ring-shadow: 0 0 #0000 !important; }
.fi-section-header { padding: .8rem 1.1rem !important; border-bottom: 1px solid var(--fd-line); }
.fi-section-header-heading { font-size: .95rem !important; font-weight: 700 !important; }
.fi-section-content { padding: 1rem 1.1rem !important; }
.fi-section-header .fi-icon { color: var(--fd-accent) !important; }
.fi-fo-field-label-content, .fi-fo-field-wrp-label span { font-size: .85rem !important; font-weight: 600 !important; }
.fi-input-wrp { border-radius: 7px !important; }
.fi-btn { border-radius: 7px !important; font-weight: 600 !important; }

/* ---------- Tables / lists (WordPress list screens) ---------- */
.fi-ta-ctn { border-radius: 10px !important; border: 1px solid var(--fd-line) !important; box-shadow: 0 1px 2px rgba(16,24,40,.05) !important; --tw-ring-shadow: 0 0 #0000 !important; }
.fi-ta-header-cell { text-transform: uppercase; font-size: .68rem !important; letter-spacing: .07em; color: var(--fd-body) !important; padding-block: .55rem !important; }
.fi-ta-cell { padding-block: .1rem !important; }
.fi-ta-text { padding-block: .55rem !important; }
.fi-ta-text-item-label, .fi-ta-text-item { font-size: .9rem !important; }
.fi-ta-row:hover { background: color-mix(in srgb, var(--fd-accent) 4%, transparent) !important; }
/* WordPress-style: row actions fade in on hover (always visible on touch screens) */
@media (hover: hover) {
  .fi-ta-row .fi-ta-actions { opacity: .25; transition: opacity .12s ease; }
  .fi-ta-row:hover .fi-ta-actions, .fi-ta-row:focus-within .fi-ta-actions { opacity: 1; }
}
.fi-ta-actions .fi-link, .fi-ta-actions .fi-ac-link-action { font-size: .82rem !important; font-weight: 600 !important; }
/* Status tabs above lists: All (12) | Published (8) | Pending (3) */
.fi-tabs { box-shadow: none !important; background: transparent !important; border: 0 !important; padding: 0 !important; gap: .15rem !important; border-bottom: 1px solid var(--fd-line) !important; border-radius: 0 !important; overflow-x: auto; }
.fi-tabs-item { border-radius: 0 !important; padding: .55rem .8rem !important; border-bottom: 2px solid transparent !important; margin-bottom: -1px; background: transparent !important; }
.fi-tabs-item.fi-active { border-bottom-color: var(--fd-accent) !important; }
.fi-tabs-item .fi-tabs-item-label { font-weight: 600 !important; font-size: .88rem !important; }
.fi-tabs-item .fi-badge { font-size: .68rem !important; }
.fi-ta-empty-state-heading { font-size: 1.05rem !important; }

/* Badges: consistent status colours */
.fi-badge { font-weight: 600 !important; border-radius: 999px !important; }

/* ---------- Two-column edit screens ---------- */
.fd-side .fi-section-header { background: color-mix(in srgb, var(--fd-bg) 60%, var(--fd-card)); }
.fd-serp { font-family: arial, sans-serif; border: 1px solid var(--fd-line); border-radius: 8px; padding: .8rem .9rem; background: #fff; }
html.dark .fd-serp { background: #202124; }
.fd-serp-url { color: #202124; font-size: 12.5px; display: flex; gap: .4rem; align-items: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.dark .fd-serp-url { color: #bdc1c6; }
.fd-serp-url i { width: 18px; height: 18px; border-radius: 50%; background: #e8eaed; display: inline-grid; place-items: center; font-style: normal; font-size: 10px; font-weight: 700; color: #1a73e8; flex: none; }
.fd-serp-title { color: #1a0dab; font-size: 18px; line-height: 1.3; margin: .3rem 0 .15rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
html.dark .fd-serp-title { color: #8ab4f8; }
.fd-serp-desc { color: #4d5156; font-size: 13.5px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
html.dark .fd-serp-desc { color: #bdc1c6; }
.fd-serp-meta { display: flex; justify-content: space-between; font-size: .75rem; color: var(--fd-body); margin-top: .45rem; }
.fd-serp-meta .bad { color: var(--fd-bad); font-weight: 700; }

/* ---------- Dashboard boxes ---------- */
.fd-box .fd-ic { width: 1.1rem; height: 1.1rem; flex: none; }
.fd-muted { color: var(--fd-body); font-size: .82rem; }
.fd-mt { margin-top: .85rem; display: inline-block; }
.fd-grow { flex: 1; min-width: 0; }
.fd-link { color: var(--fd-accent); font-weight: 600; font-size: .85rem; text-decoration: none; }
.fd-link:hover { text-decoration: underline; }
.fd-pill { display: inline-flex; min-width: 1.6rem; justify-content: center; padding: .1rem .5rem; border-radius: 999px; font-size: .74rem; font-weight: 800; }
.fd-pill.fd-warning { background: #fcf0d0; color: #8a5a00; }
.fd-pill.fd-danger { background: #fde2e2; color: #b42318; }
.fd-pill.fd-info { background: #e0ecff; color: #1d4ed8; }
.fd-pill.fd-success { background: #dcfce7; color: #166534; }
.fd-pill.fd-zero { background: color-mix(in srgb, var(--fd-body) 12%, transparent); color: var(--fd-body); }

.fd-glance { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .5rem; }
.fd-glance-item { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: .6rem; align-items: center; padding: .6rem .7rem; border-radius: 8px; border: 1px solid var(--fd-line); text-decoration: none; color: var(--fd-ink); }
a.fd-glance-item:hover { border-color: var(--fd-accent); }
.fd-glance-item .fd-ic { grid-row: span 2; color: var(--fd-accent); width: 1.3rem; height: 1.3rem; }
.fd-glance-val { font-weight: 800; font-size: 1.2rem; line-height: 1.1; }
.fd-glance-lbl { font-size: .74rem; color: var(--fd-body); }

.fd-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.fd-list-row { display: flex; align-items: center; gap: .65rem; padding: .48rem .5rem; border-radius: 6px; color: var(--fd-ink); text-decoration: none; font-size: .88rem; }
.fd-list-row:hover { background: color-mix(in srgb, var(--fd-accent) 7%, transparent); }
.fd-list-row .fd-ic { color: var(--fd-body); }
.fd-dim { opacity: .55; }
.fd-allgood { display: flex; gap: .5rem; align-items: center; color: #166534; background: #dcfce7; border-radius: 8px; padding: .6rem .75rem; font-weight: 600; font-size: .86rem; margin-bottom: .6rem; }
html.dark .fd-allgood { background: #0f2e1b; color: #86efac; }

.fd-quick { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .5rem; }
.fd-quick-btn { display: flex; align-items: center; gap: .5rem; padding: .65rem .7rem; border-radius: 8px; border: 1px solid var(--fd-line); color: var(--fd-ink); text-decoration: none; font-weight: 600; font-size: .85rem; }
.fd-quick-btn .fd-ic { color: var(--fd-accent); }
.fd-quick-btn:hover { background: var(--fd-accent); border-color: var(--fd-accent); color: #fff; }
.fd-quick-btn:hover .fd-ic { color: #fff; }

.fd-meter { height: 6px; border-radius: 999px; background: color-mix(in srgb, var(--fd-body) 15%, transparent); overflow: hidden; margin-bottom: .8rem; }
.fd-meter span { display: block; height: 100%; background: linear-gradient(90deg, var(--fd-accent), #22c55e); border-radius: inherit; }
.fd-domain { display: flex; gap: .55rem; align-items: center; padding: .55rem .7rem; border-radius: 8px; background: color-mix(in srgb, var(--fd-accent) 8%, transparent); color: var(--fd-ink); text-decoration: none; font-size: .85rem; margin-bottom: .6rem; }
.fd-domain b { font-size: .8rem; }
.fd-domain-bad { background: #fde2e2; color: #b42318; }
html.dark .fd-domain-bad { background: #3b1414; color: #fca5a5; }
.fd-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }
.fd-checks li { display: flex; gap: .55rem; align-items: flex-start; padding: .35rem .2rem; font-size: .86rem; color: var(--fd-ink); }
.fd-checks li .fd-ic { color: var(--fd-warn); margin-top: .1rem; }
.fd-checks li.fd-ok .fd-ic { color: var(--fd-ok); }
.fd-checks li.fd-ok { color: var(--fd-body); }
.fd-checks a { color: var(--fd-accent); font-weight: 600; text-decoration: none; }
.fd-checks small { display: block; color: var(--fd-body); font-size: .76rem; }

.fd-activity { list-style: none; margin: 0; padding: 0; }
.fd-activity li { display: flex; gap: .7rem; align-items: center; padding: .55rem 0; border-bottom: 1px solid var(--fd-line); font-size: .88rem; }
.fd-activity li:last-child { border-bottom: 0; }
.fd-activity a { color: var(--fd-ink); text-decoration: none; }
.fd-activity a:hover { color: var(--fd-accent); }
.fd-act-ic { width: 2rem; height: 2rem; border-radius: 8px; display: grid; place-items: center; flex: none; }
.fd-act-ic.fd-info { background: #e0ecff; color: #1d4ed8; }
.fd-act-ic.fd-warning { background: #fcf0d0; color: #8a5a00; }
.fd-act-ic.fd-success { background: #dcfce7; color: #166534; }
.fd-act-ic.fd-gray { background: color-mix(in srgb, var(--fd-body) 12%, transparent); color: var(--fd-body); }
.fd-status { display: inline-block; margin-left: .4rem; font-size: .68rem; font-weight: 700; padding: .05rem .45rem; border-radius: 999px; background: #fcf0d0; color: #8a5a00; vertical-align: 1px; }
.fd-st-flagged, .fd-st-rejected, .fd-st-removed { background: #fde2e2; color: #b42318; }
.fd-st-unread { background: #e0ecff; color: #1d4ed8; }
.fd-empty-mini { color: var(--fd-body); font-size: .88rem; padding: .5rem 0; }
.fi-wi-chart .fi-section-content { padding-top: .5rem !important; }

/* ---------- Login: branded split screen ---------- */
.fi-simple-layout:has(.fd-login-side) { display: grid !important; grid-template-columns: 1fr; min-height: 100vh; background: var(--fd-bg); }
@media (min-width: 1024px) { .fi-simple-layout:has(.fd-login-side) { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); } }
.fd-login-side { display: none; position: relative; color: #fff; overflow: hidden;
  background: linear-gradient(160deg, rgba(15,23,42,.92), rgba(29,78,216,.82)), var(--fd-login-img, none) center/cover no-repeat, #0f172a; }
@media (min-width: 1024px) { .fd-login-side { display: block; } }
.fd-login-side-inner { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 3rem 3.5rem; gap: 2rem; }
.fd-login-brand { display: flex; align-items: center; gap: .6rem; font-weight: 800; font-size: 1.1rem; }
.fd-login-admin { color: #72aee6; font-weight: 700; margin-left: .25rem; }
.fd-login-logo { height: 2.25rem; width: auto; }
.fd-login-kicker { text-transform: uppercase; letter-spacing: .14em; font-size: .72rem; font-weight: 700; color: #93c5fd; margin: 0 0 .75rem; }
.fd-login-title { font-size: 2.1rem; line-height: 1.15; font-weight: 800; letter-spacing: -.02em; max-width: 30rem; margin: 0; }
.fd-login-points { list-style: none; padding: 0; margin: 1.6rem 0 0; display: grid; gap: .6rem; color: #dbeafe; }
.fd-login-points li::before { content: "✓"; display: inline-grid; place-items: center; width: 1.3rem; height: 1.3rem; border-radius: 50%; background: rgba(255,255,255,.15); margin-right: .6rem; font-size: .75rem; font-weight: 800; }
.fd-login-foot { color: #93a4bf; font-size: .8rem; margin: 0; }
.fi-simple-layout:has(.fd-login-side) .fi-simple-main-ctn { display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; }
.fi-simple-layout:has(.fd-login-side) .fi-simple-main { box-shadow: 0 10px 40px rgba(15,23,42,.08) !important; border-radius: 16px !important; border: 1px solid var(--fd-line); }

/* ---------- TinyMCE ---------- */
.tox-tinymce { border-radius: 8px !important; border-color: var(--fd-line) !important; }

/* ---------- Dark mode touches ---------- */
html.dark body.fi-body { color: var(--fd-ink); }
html.dark .fd-pill.fd-warning, html.dark .fd-act-ic.fd-warning, html.dark .fd-status { background: #3a2e0b; color: #fcd34d; }
html.dark .fd-pill.fd-danger { background: #3b1414; color: #fca5a5; }
html.dark .fd-pill.fd-info, html.dark .fd-act-ic.fd-info, html.dark .fd-st-unread { background: #10234a; color: #93c5fd; }
html.dark .fd-pill.fd-success, html.dark .fd-act-ic.fd-success { background: #0f2e1b; color: #86efac; }

/* ---------- Phones ---------- */
@media (max-width: 640px) {
  .fi-header-heading { font-size: 1.35rem !important; }
  .fd-glance, .fd-quick { grid-template-columns: 1fr 1fr; }
  .fd-dd-wide, .fd-bell + .fd-dd-menu { position: fixed; left: .5rem; right: .5rem; top: 3.6rem; min-width: 0; }
}

/* login fixes: full-height panel, readable brand on the white card */
.fi-simple-layout:has(.fd-login-side) { min-height: 100vh; align-items: stretch !important; justify-items: stretch; }
.fd-login-side { min-height: 100vh; align-self: stretch; }
.fi-simple-main .fd-brand-name { color: var(--fd-ink); }
.fi-simple-main .fd-brand-name b, .fi-simple-main .fd-brand-tag { color: var(--fd-accent); }
.fi-simple-main .fi-logo { justify-content: center; }
/* status tabs aligned left like WordPress */
.fi-resource-list-records-page .fi-tabs, .fi-page .fi-tabs { margin-inline: 0 !important; justify-content: flex-start !important; width: 100%; }
/* SEO preview stays inside its box */
.fd-serp { max-width: 100%; overflow: hidden; box-sizing: border-box; }
.fd-serp-url span { overflow: hidden; text-overflow: ellipsis; }
.fd-serp-meta { flex-wrap: wrap; gap: .25rem; }
/* no gap between top bar and sidebar */
.fi-sidebar.fi-main-sidebar { top: 0 !important; }
.fi-layout:has(.fi-topbar) .fi-sidebar.fi-main-sidebar { padding-top: 0 !important; }
/* profile page in a card */
.fi-page-auth-edit-profile .fi-sc-form, .fi-edit-profile .fi-sc-form { background: var(--fd-card); border: 1px solid var(--fd-line); border-radius: 10px; padding: 1.25rem; max-width: 52rem; }
/* uploaded logo: white pill so dark logos stay visible on the dark bar */
.fi-topbar .fd-brand-img, .fi-sidebar-header .fd-brand-img { background: #fff; padding: .2rem .45rem; border-radius: 6px; height: 1.9rem; }
.fi-simple-main .fd-brand-img { height: 2.4rem; }

/* ---------- Theme editor preview ---------- */
.fd-theme-preview { position: sticky; top: 72px; }
.fd-theme-preview__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 8px 12px; border: 1px solid rgba(127,127,127,.25); border-bottom: 0; border-radius: 8px 8px 0 0; background: rgba(127,127,127,.06); font-size: 13px; }
.fd-theme-preview__bar select { border: 1px solid rgba(127,127,127,.35); border-radius: 6px; padding: 3px 28px 3px 8px; font-size: 13px; background-color: transparent; }
.fd-theme-preview__bar a { margin-left: auto; color: var(--primary-600); font-weight: 600; }
.fd-theme-preview__sizes { display: inline-flex; border: 1px solid rgba(127,127,127,.35); border-radius: 6px; overflow: hidden; }
.fd-theme-preview__sizes button { padding: 3px 10px; font-size: 12px; }
.fd-theme-preview__sizes button.is-on { background: var(--primary-600); color: #fff; }
.fd-theme-preview__loading { color: #b45309; font-weight: 600; }
.fd-theme-preview__stage { position: relative; border: 1px solid rgba(127,127,127,.25); border-radius: 0 0 8px 8px; background: #e5e7eb; height: calc(100vh - 190px); min-height: 520px; overflow: hidden; display: flex; justify-content: center; }
.fd-theme-preview__stage iframe { border: 0; background: #fff; transition: width .2s; }
.fd-theme-preview__note { margin-top: 6px; font-size: 12px; opacity: .65; }
@media (max-width: 1279px) { .fd-theme-preview { position: static; } .fd-theme-preview__stage { height: 640px; } }
/* Homepage sections list: one compact row per section (label + arrows on the left, switch on the right) */
.fd-sections .fi-fo-repeater-items { gap: 6px; }
.fd-sections .fi-fo-repeater-item { display: flex; align-items: center; justify-content: space-between; }
.fd-sections .fi-fo-repeater-item-header { flex: 1; border: 0 !important; padding-top: 8px; padding-bottom: 8px; }
.fd-sections .fi-fo-repeater-item-content { border: 0 !important; padding: 0 14px 0 0 !important; }

/* ---------- Backups page ---------- */
.fd-backups { display: flex; flex-direction: column; gap: 18px; }
.fd-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.fd-stats > div { border: 1px solid rgba(127,127,127,.22); border-radius: 8px; padding: 12px 14px; background: var(--fd-card, #fff); }
.dark .fd-stats > div { background: rgba(255,255,255,.03); }
.fd-stats span { display: block; font-size: 12px; opacity: .65; }
.fd-stats b { display: block; margin-top: 2px; font-size: 15px; overflow-wrap: anywhere; }
.fd-stats .fd-low b { color: #b91c1c; }
@media (max-width: 900px) { .fd-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fd-banner { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 12px 14px; border-radius: 8px; font-size: 14px; border: 1px solid; }
.fd-banner-warn { background: #fffbeb; border-color: #fcd34d; color: #92400e; }
.fd-banner-ok { background: #ecfdf5; border-color: #6ee7b7; color: #065f46; }
.fd-banner-bad { background: #fef2f2; border-color: #fca5a5; color: #991b1b; }
.fd-table-wrap { overflow-x: auto; margin: -4px -4px 0; }
.fd-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.fd-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; opacity: .6; font-weight: 600; padding: 8px 10px; border-bottom: 1px solid rgba(127,127,127,.2); white-space: nowrap; }
.fd-table td { padding: 10px; border-bottom: 1px solid rgba(127,127,127,.12); vertical-align: top; }
.fd-table td small { display: block; font-size: 12px; opacity: .6; margin-top: 2px; max-width: 280px; }
.fd-table .fd-pill { display: inline-flex; align-items: center; gap: 4px; }
.fd-actions { white-space: nowrap; text-align: right; }
.fd-actions > * { margin-left: 12px; }
.fd-backups .fd-link { color: var(--primary-600); font-weight: 600; font-size: 13.5px; }
.fd-backups .fd-link:hover { text-decoration: underline; }
.fd-note { margin-top: 12px; font-size: 12.5px; opacity: .7; }
.fd-empty { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 28px 0; text-align: center; opacity: .8; }
.fd-code { font-size: 12px; padding: 1px 5px; border-radius: 4px; background: rgba(127,127,127,.12); overflow-wrap: anywhere; user-select: all; }
.fd-backups .fd-activity { font-size: 12.5px; line-height: 1.7; opacity: .85; }
.fd-backups .fd-checks small { display: block; }

/* ---------- Security page (Wordfence-style) ---------- */
.fd-sec { display: flex; flex-direction: column; gap: 18px; }
.fd-sec-banner { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 14px 18px; border-radius: 10px; background: #0f6fa3; color: #fff; font-size: 16px; font-weight: 600; }
.fd-sec-banner-off { background: #b91c1c; }
.fd-sec-banner-ip { margin-left: auto; font-size: 13px; font-weight: 500; opacity: .85; }
.fd-sec-tabs { display: flex; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid rgba(127,127,127,.25); }
.fd-sec-tabs button { padding: 9px 14px; font-size: 14px; font-weight: 600; opacity: .7; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.fd-sec-tabs button.is-on { opacity: 1; color: var(--primary-600); border-color: var(--primary-600); }
.fd-sec-rings { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.fd-sec-ring { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 18px 12px; border: 1px solid rgba(127,127,127,.22); border-radius: 10px; background: var(--fd-card, #fff); text-align: center; transition: border-color .15s; }
.dark .fd-sec-ring { background: rgba(255,255,255,.03); }
.fd-sec-ring:hover { border-color: var(--primary-500); }
.fd-sec-ring b { font-size: 15px; margin-top: 4px; }
.fd-sec-ring span { font-size: 12.5px; opacity: .65; }
@media (max-width: 760px) { .fd-sec-rings { grid-template-columns: 1fr; } }
.fd-sec-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 1100px) { .fd-sec-grid { grid-template-columns: 1fr; } }
.fd-sec-muted { font-size: 12.5px; opacity: .65; margin-top: 8px; }
.fd-sec-ok, .fd-sec-bad, .fd-sec-warn { display: flex; align-items: center; gap: 6px; font-weight: 600; font-size: 14px; }
.fd-sec-ok { color: #15803d; } .fd-sec-bad { color: #b91c1c; } .fd-sec-warn { color: #b45309; }
.fd-sec-issues { display: flex; flex-direction: column; gap: 8px; }
.fd-sec-issues li { display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; color: #b45309; }
.fd-sec-issues li.is-bad { color: #b91c1c; }
.fd-sec-issues li div { color: inherit; }
.fd-sec-issues small { display: block; opacity: .8; color: rgba(127,127,127,1); }
.fd-sec-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.fd-sec-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; opacity: .6; font-weight: 600; padding: 7px 8px; border-bottom: 1px solid rgba(127,127,127,.2); white-space: nowrap; }
.fd-sec-table td { padding: 8px; border-bottom: 1px solid rgba(127,127,127,.12); vertical-align: top; }
.fd-sec-table td small { display: block; font-size: 12px; opacity: .6; margin-top: 2px; }
.fd-sec-table tr.is-dim { opacity: .5; }
.fd-sec-table code, .fd-sec-files code { font-size: 12px; overflow-wrap: anywhere; }
.fd-sec-sum td, .fd-sec-sum th { text-align: center; }
.fd-sec-sum tbody th { text-align: left; text-transform: none; font-size: 13.5px; opacity: 1; letter-spacing: 0; }
.fd-sec-detail { max-width: 340px; overflow-wrap: anywhere; }
.fd-sec-chart { display: flex; align-items: flex-end; gap: 3px; height: 150px; padding-top: 6px; border-bottom: 1px solid rgba(127,127,127,.25); }
.fd-sec-bar { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; min-width: 3px; }
.fd-sec-bar span { display: block; width: 100%; }
.fd-sec-bar span:first-child { border-radius: 2px 2px 0 0; }
.c-probe { background: #f59e0b; } .c-login { background: #6366f1; } .c-blocked { background: #ef4444; }
.fd-sec-axis { display: flex; justify-content: space-between; font-size: 11px; opacity: .6; margin-top: 4px; }
.fd-sec-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; font-size: 12.5px; align-items: center; }
.fd-sec-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; }
.fd-sec-legend .fd-sec-muted { margin: 0 0 0 auto; }
.fd-sec-list { display: flex; flex-direction: column; }
.fd-sec-list li { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid rgba(127,127,127,.12); font-size: 13.5px; }
.fd-sec-list li:last-child { border-bottom: 0; }
.fd-sec-list small { display: block; font-size: 12px; opacity: .6; }
.fd-sec-more { display: inline-block; margin-top: 10px; }
.fd-sec .fd-link { color: var(--primary-600); font-weight: 600; font-size: 13.5px; }
.fd-sec-filter { display: inline-flex; border: 1px solid rgba(127,127,127,.3); border-radius: 8px; overflow: hidden; }
.fd-sec-filter button { padding: 5px 12px; font-size: 12.5px; font-weight: 600; }
.fd-sec-filter button.is-on { background: var(--primary-600); color: #fff; }
.fd-sec-files { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; font-size: 13px; }
.fd-sec-audit { display: flex; flex-direction: column; gap: 6px; padding: 10px 0; border-bottom: 1px solid rgba(127,127,127,.12); }
.fd-sec-audit:last-of-type { border-bottom: 0; }
.fd-sec-health-top { display: flex; justify-content: space-between; align-items: center; font-size: 14px; }
.fd-sec .fd-checks small { display: block; }
.fd-sec-bad-row { color: #b91c1c; }
.fd-nowrap { white-space: nowrap; }
.fd-sec-sum th { font-size: 10.5px; line-height: 1.25; }

/* ---------- Sales (CRM) ---------- */
.fd-crm { display: flex; flex-direction: column; gap: 18px; }
.fd-crm-muted { font-size: 13px; opacity: .65; }
.fd-crm-grow { flex: 1; min-width: 0; }
.fd-crm-mt { margin-top: 16px; }
.fd-crm-up { color: #15803d; } .fd-crm-down { color: #b91c1c; } .fd-crm-flat { opacity: .65; }
.dark .fd-crm-up { color: #86efac; } .dark .fd-crm-down { color: #fca5a5; }
.fd-crm-bar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.fd-crm-select, .fd-crm-search { height: 32px; border: 1px solid rgba(127,127,127,.3); border-radius: 8px; padding: 0 10px; font-size: 13px; background: transparent; color: inherit; }
.fd-crm-select { padding-right: 28px; }
.fd-crm-search { flex: 1; min-width: 200px; max-width: 360px; }
.dark .fd-crm-select option { background: #18181b; }
.fd-crm-tag { display: inline-flex; align-items: center; gap: 5px; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; background: rgba(127,127,127,.13); white-space: nowrap; }
.fd-crm-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--stage, #94a3b8); display: inline-block; }
.fd-crm-sub-head { margin: 18px 0 8px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; opacity: .6; }
.fd-crm-sources { display: flex; flex-wrap: wrap; gap: 6px; }

/* KPI cards */
.fd-crm-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 1100px) { .fd-crm-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .fd-crm-kpis { grid-template-columns: 1fr; } }
.fd-crm-kpi { display: flex; flex-direction: column; gap: 3px; padding: 16px 18px; border: 1px solid rgba(127,127,127,.22); border-radius: 12px; background: var(--fd-card, #fff); transition: border-color .15s; }
.dark .fd-crm-kpi { background: rgba(255,255,255,.03); }
a.fd-crm-kpi:hover { border-color: var(--primary-500); }
.fd-crm-kpi-label { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; opacity: .7; }
.fd-crm-kpi b { font-size: 24px; line-height: 1.25; letter-spacing: -.01em; }
.fd-crm-kpi > span:not(.fd-crm-kpi-label) { font-size: 13px; opacity: .75; }
.fd-crm-kpi small { font-size: 12px; margin-top: 4px; }

/* horizontal bars */
.fd-crm-hbars { display: flex; flex-direction: column; gap: 10px; }
.fd-crm-hbar { display: grid; grid-template-columns: 120px 1fr 110px; gap: 10px; align-items: center; font-size: 13px; }
.fd-crm-hbar-label { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fd-crm-hbar-track { height: 12px; border-radius: 6px; background: rgba(127,127,127,.12); overflow: hidden; }
.fd-crm-hbar-track i { display: block; height: 100%; border-radius: 6px; transition: width .3s; }
.fd-crm-hbar-val { text-align: right; font-weight: 700; }
.fd-crm-hbar-val small { display: block; font-weight: 500; font-size: 11.5px; opacity: .6; }
@media (max-width: 560px) { .fd-crm-hbar { grid-template-columns: 90px 1fr 90px; } }

/* monthly column chart */
.fd-crm-vchart { display: flex; align-items: flex-end; gap: 6px; height: 220px; padding-top: 22px; border-bottom: 1px solid rgba(127,127,127,.25); }
.fd-crm-vcol { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; position: relative; min-width: 0; }
.fd-crm-vcol.is-future { opacity: .35; }
.fd-crm-vbar { width: 100%; max-width: 46px; display: flex; flex-direction: column-reverse; border-radius: 4px 4px 0 0; overflow: hidden; min-height: 0; }
.fd-crm-vbar i { display: block; min-height: 2px; }
.fd-crm-vval { font-size: 10.5px; font-weight: 700; white-space: nowrap; margin-bottom: 3px; opacity: .8; }
.fd-crm-vlabel { position: absolute; bottom: -20px; font-size: 11px; opacity: .65; }
.fd-crm-vchart + .fd-sec-legend { margin-top: 28px; }
@media (max-width: 700px) { .fd-crm-vval { display: none; } }
.fd-crm-total td { font-weight: 800; border-top: 2px solid rgba(127,127,127,.25); }

/* Kanban board */
.fd-crm-board { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 10px; align-items: flex-start; scroll-snap-type: x proximity; }
.fd-crm-col { flex: 0 0 272px; display: flex; flex-direction: column; border-radius: 12px; background: rgba(127,127,127,.07); border-top: 3px solid var(--stage); max-height: calc(100vh - 230px); scroll-snap-align: start; transition: background .15s, box-shadow .15s; }
.fd-crm-col.is-over { background: color-mix(in srgb, var(--stage) 14%, transparent); box-shadow: inset 0 0 0 2px var(--stage); }
.fd-crm-col-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 10px 12px 8px; }
.fd-crm-col-head b { font-size: 14px; }
.fd-crm-col-head small { font-size: 12px; font-weight: 700; opacity: .7; white-space: nowrap; }
.fd-crm-count { margin-left: 6px; font-size: 11.5px; font-weight: 700; padding: 0 7px; border-radius: 999px; background: rgba(127,127,127,.18); }
.fd-crm-cards { display: flex; flex-direction: column; gap: 8px; padding: 0 8px 10px; overflow-y: auto; min-height: 80px; }
.fd-crm-card { display: flex; flex-direction: column; gap: 5px; padding: 10px 11px; border-radius: 10px; background: var(--fd-card, #fff); border: 1px solid rgba(127,127,127,.2); box-shadow: 0 1px 2px rgba(0,0,0,.05); cursor: grab; font-size: 13px; }
.dark .fd-crm-card { background: #1f1f23; }
.fd-crm-card:hover { border-color: var(--stage); }
.fd-crm-card.is-drag { opacity: .45; }
.fd-crm-card-title { font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.fd-crm-card-title:hover { color: var(--primary-600); text-decoration: underline; }
.fd-crm-card-sub { font-size: 12px; opacity: .65; }
.fd-crm-card-row { display: flex; align-items: center; gap: 6px; }
.fd-crm-card-row b { font-size: 13.5px; }
.fd-crm-avatar { margin-left: auto; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 10.5px; font-weight: 800; background: color-mix(in srgb, var(--primary-500) 18%, transparent); color: var(--primary-700); flex: none; }
.dark .fd-crm-avatar { color: var(--primary-300); }
.fd-crm-due { display: flex; align-items: center; gap: 4px; font-size: 11.5px; opacity: .75; }
.fd-crm-due.is-late { color: #b91c1c; opacity: 1; font-weight: 700; }
.fd-crm-due.is-won { color: #15803d; opacity: 1; font-weight: 600; }
.dark .fd-crm-due.is-late { color: #fca5a5; } .dark .fd-crm-due.is-won { color: #86efac; }
.fd-crm-card-foot { display: flex; justify-content: space-between; align-items: center; gap: 6px; padding-top: 6px; margin-top: 2px; border-top: 1px dashed rgba(127,127,127,.2); }
.fd-crm-card-foot .fd-link { font-size: 12px; color: var(--primary-600); font-weight: 600; }
.fd-crm-move { height: 24px; font-size: 11.5px; border: 1px solid rgba(127,127,127,.25); border-radius: 6px; padding: 0 22px 0 6px; background-color: transparent; color: inherit; max-width: 110px; }
.fd-crm-empty { font-size: 12px; opacity: .45; text-align: center; padding: 22px 0; border: 1.5px dashed rgba(127,127,127,.3); border-radius: 10px; }
@media (max-width: 640px) { .fd-crm-col { flex-basis: 84vw; max-height: none; } }

/* deal history timeline */
.fd-crm-timeline { display: flex; flex-direction: column; }
.fd-crm-timeline li { display: flex; gap: 12px; position: relative; padding-bottom: 16px; }
.fd-crm-timeline li:not(:last-child)::before { content: ""; position: absolute; left: 14px; top: 30px; bottom: 2px; width: 2px; background: rgba(127,127,127,.18); }
.fd-crm-tl-icon { flex: none; width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--primary-500) 14%, transparent); color: var(--primary-600); }
.fd-crm-timeline li > div { min-width: 0; flex: 1; font-size: 13.5px; }
.fd-crm-tl-head { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.fd-crm-tl-head span { font-size: 12px; opacity: .6; }
.fd-crm-timeline p { margin-top: 3px; line-height: 1.55; overflow-wrap: anywhere; }
.fd-crm-kpi b.fd-crm-kpi-text { font-size: 17px; line-height: 1.35; padding: 4px 0 2px; }

/* ---------- Analytics (Google Analytics) ---------- */
.fd-ga-error { display: flex; gap: 10px; padding: 12px 16px; border-radius: 10px; background: #fde2e2; color: #b42318; font-size: 13.5px; }
.dark .fd-ga-error { background: #3b1414; color: #fca5a5; }
.fd-ga-steps { display: flex; flex-direction: column; gap: 18px; }
.fd-ga-steps li { display: flex; gap: 12px; }
.fd-ga-steps p { font-size: 13.5px; opacity: .8; margin-top: 2px; line-height: 1.55; }
.fd-ga-step-ic { flex: none; width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; background: rgba(127,127,127,.15); }
.fd-ga-steps li.is-done .fd-ga-step-ic { background: #16a34a; color: #fff; }
.fd-ga-btn { margin-top: 10px; }
.fd-ga-props { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.fd-ga-prop { text-align: left; padding: 9px 12px; border: 1px solid rgba(127,127,127,.3); border-radius: 8px; font-size: 13.5px; font-weight: 600; }
.fd-ga-prop:hover { border-color: var(--primary-500); color: var(--primary-600); }
.fd-ga-prop small { opacity: .55; font-weight: 500; margin-left: 6px; }
.fd-ga-live { display: inline-flex; align-items: center; gap: 7px; margin-left: auto; padding: 4px 11px; border-radius: 999px; background: #dcfce7; color: #166534; font-size: 12.5px; font-weight: 700; }
.dark .fd-ga-live { background: #0f2e1b; color: #86efac; }
.fd-ga-live i { width: 8px; height: 8px; border-radius: 50%; background: #16a34a; animation: fd-ga-pulse 1.6s infinite; }
@keyframes fd-ga-pulse { 50% { opacity: .3; } }
.fd-ga-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 1280px) { .fd-ga-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .fd-ga-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fd-ga-kpis .fd-crm-kpi { padding: 14px 16px; }
.fd-ga-kpis .fd-crm-kpi b { font-size: 22px; }
.fd-ga-chart { position: relative; height: 200px; border-bottom: 1px solid rgba(127,127,127,.25); }
.fd-ga-chart svg { width: 100%; height: 100%; display: block; }
.fd-ga-hover { position: absolute; inset: 0; display: flex; }
.fd-ga-hover span { flex: 1; }
.fd-ga-hover span:hover { background: rgba(127,127,127,.1); }
.fd-ga-max { position: absolute; top: 0; left: 0; font-size: 11px; opacity: .55; }
.fd-ga-stack { display: flex; height: 12px; border-radius: 6px; overflow: hidden; margin-bottom: 8px; gap: 2px; }
.fd-ga-pct { width: 52px; text-align: right; font-size: 12px; opacity: .6; }
.fd-ga-three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 1100px) { .fd-ga-three { grid-template-columns: 1fr; } }
.fd-ga-hbar { grid-template-columns: 110px 1fr 60px; }

/* ---------- Country flags (Security) ---------- */
.fd-place { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.fd-flag { width: 18px; height: 13.5px; border-radius: 2px; object-fit: cover; box-shadow: 0 0 0 1px rgba(0,0,0,.12); flex: none; }
.fd-flag-city { opacity: .7; }
.fd-sec-banner-ip .fd-place { margin-left: 4px; }
.fd-sec-table td small .fd-place, .fd-sec-list small .fd-place { margin-top: 2px; }
.fd-sec-countries { display: flex; flex-direction: column; gap: 10px; }
.fd-sec-country { display: grid; grid-template-columns: 210px 1fr 110px 90px; gap: 12px; align-items: center; font-size: 13.5px; }
.fd-sec-country-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
.fd-sec-country-n { text-align: right; }
.fd-sec-country-n small { display: block; font-size: 11.5px; opacity: .6; }
@media (max-width: 640px) { .fd-sec-country { grid-template-columns: 1fr 70px; } .fd-sec-country .fd-crm-hbar-track { display: none; } .fd-sec-country .fd-actions { grid-column: span 2; text-align: left; } }

/* ---------- Themes (ready-made website looks) ---------- */
.fd-themes { display: flex; flex-direction: column; gap: 16px; }
.fd-themes-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 20px; }
.fd-theme-card { display: flex; flex-direction: column; border: 1px solid rgba(127,127,127,.22); border-radius: 14px; overflow: hidden; background: var(--fd-card, #fff); transition: border-color .15s, box-shadow .15s; }
.dark .fd-theme-card { background: rgba(255,255,255,.03); }
.fd-theme-card:hover { border-color: var(--primary-400); box-shadow: 0 10px 30px -18px rgba(15,23,42,.35); }
.fd-theme-card.is-active { border: 2px solid #16a34a; }
.fd-theme-mock { height: 230px; overflow: hidden; display: flex; flex-direction: column; font-size: 10px; border-bottom: 1px solid rgba(127,127,127,.18); }
.fd-mock-header { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; border-bottom: 1px solid rgba(127,127,127,.15); }
.fd-mock-header.is-centered { flex-direction: column; gap: 5px; padding: 7px 12px 6px; }
.fd-mock-header.is-minimal { padding: 5px 12px; }
.fd-mock-logo { display: flex; align-items: center; gap: 5px; font-size: 11px; }
.fd-mock-logo i { width: 12px; height: 12px; display: inline-block; }
.fd-mock-nav { display: flex; align-items: center; gap: 6px; }
.fd-mock-nav i { width: 22px; height: 4px; border-radius: 2px; background: currentColor; opacity: .35; }
.fd-mock-nav em { width: 46px; height: 14px; display: inline-block; }
.fd-mock-hero { display: flex; align-items: center; gap: 12px; padding: 14px 12px; }
.fd-mock-hero.is-left { flex-direction: row-reverse; }
.fd-mock-hero.is-background { padding: 18px 14px; }
.fd-mock-hero > div:first-child { flex: 1; }
.fd-mock-h { font-size: 16px; font-weight: 700; line-height: 1.15; }
.fd-mock-btn { display: inline-block; margin-top: 8px; padding: 4px 9px; font-size: 9px; font-weight: 700; }
.fd-mock-stars { display: block; margin-top: 5px; font-size: 10px; letter-spacing: 1px; }
.fd-mock-img { width: 38%; height: 70px; flex: none; }
.fd-mock-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; padding: 0 12px; flex: 1; }
.fd-mock-cards.is-compact { grid-template-columns: repeat(4, 1fr); gap: 5px; }
.fd-mock-cards.is-list { grid-template-columns: 1fr; gap: 5px; }
.fd-mock-card { border: 1px solid; background: #fff; overflow: hidden; display: flex; flex-direction: column; height: 62px; }
.fd-mock-card i { display: block; height: 30px; border-radius: 0 !important; }
.fd-mock-card div { padding: 4px 5px; display: flex; flex-direction: column; gap: 3px; }
.fd-mock-card b { font-size: 8.5px; }
.fd-mock-card span { height: 3px; border-radius: 2px; background: currentColor; opacity: .2; }
.fd-mock-cards.is-list .fd-mock-card { flex-direction: row; height: 34px; }
.fd-mock-cards.is-list .fd-mock-card i { width: 34%; height: auto; }
.fd-mock-cards.is-compact .fd-mock-card { height: 48px; }
.fd-mock-cards.is-compact .fd-mock-card i { height: 24px; }
.fd-mock-cards.is-compact .fd-mock-card span:last-child { display: none; }
.fd-mock-footer { height: 16px; margin-top: 8px; }
.fd-theme-info { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.fd-theme-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.fd-theme-title h3 { font-size: 16px; font-weight: 700; }
.fd-theme-info p { font-size: 13px; opacity: .75; line-height: 1.5; }
.fd-theme-swatches { display: flex; align-items: center; gap: 5px; }
.fd-theme-swatches i { width: 18px; height: 18px; border-radius: 50%; box-shadow: 0 0 0 1px rgba(127,127,127,.35); }
.fd-theme-swatches small { margin-left: 6px; font-size: 12px; opacity: .65; }
.fd-theme-actions { display: flex; gap: 8px; margin-top: auto; padding-top: 6px; }
.fd-themes-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; }

/* ---------- Performance ---------- */
.fd-perf-btns { margin-top: 12px; }
.fd-perf-speed { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 18px; }
@media (max-width: 640px) { .fd-perf-speed { grid-template-columns: 1fr; } }
.fd-perf-page { border: 1px solid rgba(127,127,127,.2); border-radius: 12px; padding: 14px 16px; }
.fd-perf-page-head { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; flex-wrap: wrap; font-size: 14px; }
.fd-perf-page-head .fd-link { font-size: 12px; }
.fd-perf-rings { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.fd-perf-ring { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 3px; font-size: 13px; }
.fd-perf-ring small { font-size: 11.5px; opacity: .65; }
.fd-perf-big { font-size: 26px; line-height: 84px; height: 84px; }
.fd-perf-tips { margin-top: 12px; padding-top: 10px; border-top: 1px dashed rgba(127,127,127,.25); font-size: 13px; display: flex; flex-direction: column; gap: 4px; }
.fd-perf-tips small { opacity: .6; }

/* ---------- Plugins (WordPress-style) ---------- */
.fd-plg-bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: center; }
.fd-plg-filters { display: flex; flex-wrap: wrap; gap: 2px; font-size: 13.5px; }
.fd-plg-filters button { padding: 4px 8px; color: var(--primary-600); font-weight: 600; }
.fd-plg-filters button span { opacity: .6; font-weight: 500; color: inherit; }
.fd-plg-filters button + button::before { content: "|"; color: rgba(127,127,127,.5); margin-right: 10px; font-weight: 400; }
.fd-plg-filters button.is-on { color: inherit; }
.fd-plg-table { border: 1px solid rgba(127,127,127,.22); border-radius: 12px; overflow: hidden; background: var(--fd-card, #fff); }
.dark .fd-plg-table { background: rgba(255,255,255,.03); }
.fd-plg-head, .fd-plg-row { display: grid; grid-template-columns: minmax(220px, 300px) 1fr; gap: 16px; padding: 12px 16px; }
.fd-plg-head { font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; opacity: .6; border-bottom: 1px solid rgba(127,127,127,.2); }
.fd-plg-row { border-bottom: 1px solid rgba(127,127,127,.14); border-left: 4px solid transparent; }
.fd-plg-row:last-child { border-bottom: 0; }
.fd-plg-row.is-active { border-left-color: var(--primary-500); background: color-mix(in srgb, var(--primary-500) 4%, transparent); }
.fd-plg-row.is-inactive .fd-plg-name b, .fd-plg-row.is-inactive .fd-plg-desc p { opacity: .7; }
.fd-plg-name { display: flex; gap: 12px; align-items: flex-start; }
.fd-plg-name b { font-size: 14.5px; }
.fd-plg-ic { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in srgb, var(--primary-500) 12%, transparent); color: var(--primary-600); }
.fd-plg-ic.is-big { width: 56px; height: 56px; border-radius: 14px; }
.fd-plg-links { display: flex; gap: 12px; align-items: center; margin-top: 4px; font-size: 13px; }
.fd-plg-links .fd-link { color: var(--primary-600); font-weight: 600; }
.fd-plg-req { font-size: 12px; font-weight: 600; opacity: .6; }
.fd-plg-desc p { font-size: 13.5px; line-height: 1.5; }
.fd-plg-desc small { display: block; margin-top: 4px; font-size: 12px; opacity: .6; }
.fd-plg-off { color: #b45309; opacity: 1; }
@media (max-width: 760px) { .fd-plg-head { display: none; } .fd-plg-row { grid-template-columns: 1fr; gap: 6px; } }
.fd-plg-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.fd-plg-card { display: grid; grid-template-columns: auto 1fr; gap: 12px 14px; border: 1px solid rgba(127,127,127,.22); border-radius: 12px; padding: 16px; }
.fd-plg-card-body b { font-size: 15px; }
.fd-plg-card-body p { font-size: 13px; opacity: .8; margin-top: 4px; line-height: 1.5; }
.fd-plg-card-body small { display: block; font-size: 12px; opacity: .55; margin-top: 6px; }
.fd-plg-card-act { grid-column: 1 / -1; display: flex; gap: 12px; align-items: center; justify-content: flex-end; border-top: 1px solid rgba(127,127,127,.15); padding-top: 10px; }
.fd-plg-card-act .fd-link { color: var(--primary-600); font-weight: 600; font-size: 13px; }
.fd-plg-custom { display: inline-block; font-size: 11px; font-weight: 700; padding: 0 6px; border-radius: 4px; background: #f0f6fc; color: #2271b1; }
.dark .fd-plg-custom { background: #1d2c3a; color: #72aee6; }
.fd-plg-upload { border: 1px dashed #c3c4c7; border-radius: 8px; padding: 20px; text-align: center; margin-bottom: 4px; }
.fd-plg-upload p { margin: 0 0 6px; }

/* ---------------------------------------------------------------- Store (WooCommerce-style order screen) */
.fdwc-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.fdwc-table th { text-align: left; font-weight: 600; font-size: 12px; color: #50575e; padding: 10px 8px; border-bottom: 1px solid #dcdcde; background: #f6f7f7; }
.fdwc-table td { padding: 12px 8px; border-bottom: 1px solid #f0f0f1; vertical-align: top; }
.fdwc-table .r { text-align: right; }
.fdwc-thumb { width: 38px; height: 38px; border-radius: 4px; background: #f0f0f1; display: inline-grid; place-items: center; object-fit: cover; color: #8c8f94; font-size: 15px; }
.fdwc-link { color: #2271b1; font-weight: 600; } .fdwc-link:hover { text-decoration: underline; }
.fdwc-meta { font-size: 12px; color: #646970; margin-top: 2px; }
.fdwc-empty { text-align: center; color: #646970; padding: 28px 8px !important; }
.fdwc-under { display: flex; justify-content: space-between; gap: 24px; padding: 14px 8px 4px; flex-wrap: wrap; }
.fdwc-totals { font-size: 14px; margin-left: auto; }
.fdwc-totals td { padding: 3px 0 3px 24px; text-align: right; }
.fdwc-totals td:first-child { color: #50575e; }
.fdwc-totals .fdwc-strong td { font-weight: 700; color: #1d2327; }
.fdwc-totals .fdwc-sep td { border-top: 1px solid #dcdcde; padding-top: 8px; }
.fdwc-coupon { display: inline-flex; align-items: center; gap: 2px; background: #f0f0f1; border: 1px solid #dcdcde; border-radius: 4px; padding: 2px 4px 2px 8px; font-size: 13px; font-family: monospace; margin-right: 6px; }
.fdwc-buttons { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; border-top: 1px solid #f0f0f1; margin-top: 12px; padding-top: 12px; }
.fdwc-buttons > div { display: flex; gap: 8px; flex-wrap: wrap; }
.fdwc-side { font-size: 14px; }
.fdwc-pay { display: flex; justify-content: space-between; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid #f0f0f1; }
.fdwc-due { margin-top: 10px; padding: 8px 10px; border-radius: 4px; font-weight: 600; font-size: 13px; }
.fdwc-due.is-due { background: #fcf0f1; color: #b32d2e; } .fdwc-due.is-paid { background: #edfaef; color: #008a20; }
.fdwc-notes { list-style: none; margin: 0 0 12px; padding: 0; max-height: 420px; overflow: auto; }
.fdwc-notes li { margin-bottom: 12px; }
.fdwc-note-body { background: #efefef; padding: 10px 12px; border-radius: 3px; font-size: 13px; position: relative; color: #1d2327; }
.fdwc-notes li.is-customer .fdwc-note-body { background: #a7cedc; }
.fdwc-notes li.is-system .fdwc-note-body { background: #d7cad2; }
.fdwc-note-body::after { content: ""; position: absolute; left: 20px; bottom: -10px; border: 10px solid transparent; border-left-color: inherit; border-top-color: #efefef; border-width: 10px 10px 0 0; }
.fdwc-notes li.is-customer .fdwc-note-body::after { border-top-color: #a7cedc; }
.fdwc-notes li.is-system .fdwc-note-body::after { border-top-color: #d7cad2; }
.fdwc-note-meta { font-size: 11px; color: #646970; margin: 12px 0 0; }
.fdwc-del { color: #b32d2e; margin-left: 6px; font-size: 11px; } .fdwc-del:hover { text-decoration: underline; }
.dark .fdwc-table th { background: rgba(255,255,255,.04); color: #cbd5e1; border-color: rgba(255,255,255,.1); }
.dark .fdwc-table td, .dark .fdwc-pay { border-color: rgba(255,255,255,.08); }
.dark .fdwc-note-body { color: #1d2327; }
/* Store reports */
.fdwc-filters { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 18px; }
.fdwc-filters label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 600; color: #50575e; }
.fdwc-input { font: inherit; font-size: 14px; font-weight: 400; padding: 7px 10px; border: 1px solid #c3c4c7; border-radius: 4px; background: #fff; min-width: 170px; color: #1d2327; }
.fdwc-range { margin-left: auto; display: flex; flex-direction: column; text-align: right; font-size: 13px; }
.fdwc-range small { color: #757575; }
.fdwc-tabs { display: flex; gap: 2px; border-bottom: 1px solid #dcdcde; margin-bottom: 18px; overflow-x: auto; }
.fdwc-tabs button { font: inherit; font-size: 14px; padding: 10px 14px; border: 0; background: none; color: #50575e; border-bottom: 3px solid transparent; margin-bottom: -1px; white-space: nowrap; cursor: pointer; }
.fdwc-tabs button:hover { color: #2271b1; } .fdwc-tabs button.is-on { color: #1d2327; font-weight: 600; border-bottom-color: #2271b1; }
.fdwc-tiles { display: grid; gap: 0; border: 1px solid #dcdcde; border-radius: 6px; overflow: hidden; margin-bottom: 18px; background: #fff; }
.fdwc-tile { text-align: left; padding: 16px 18px; border: 0; border-right: 1px solid #f0f0f1; border-bottom: 1px solid #f0f0f1; background: #fff; cursor: pointer; display: flex; flex-direction: column; gap: 6px; font: inherit; position: relative; }
.fdwc-tile:hover { background: #f6f7f7; } .fdwc-tile.is-on { background: #f6f7f7; box-shadow: inset 0 3px 0 #2271b1; }
.fdwc-tile-l { font-size: 13px; color: #50575e; } .fdwc-tile-v { font-size: 22px; font-weight: 600; color: #1d2327; }
.fdwc-tile-c { display: flex; gap: 8px; align-items: center; font-size: 12px; color: #757575; }
.fdwc-tile-c em { font-style: normal; font-weight: 600; padding: 1px 6px; border-radius: 3px; background: #f0f0f1; }
.fdwc-tile-c em.up { color: #008a20; background: #edfaef; } .fdwc-tile-c em.down { color: #b32d2e; background: #fcf0f1; }
.fdwc-legend { font-size: 12px; color: #50575e; display: inline-flex; align-items: center; gap: 6px; }
.fdwc-legend i { width: 14px; height: 3px; display: inline-block; border-radius: 2px; }
.fdwc-dim { opacity: .5; transition: opacity .2s; }
.dark .fdwc-tile, .dark .fdwc-tiles, .dark .fdwc-input { background: rgba(255,255,255,.03); color: #e2e8f0; border-color: rgba(255,255,255,.1); }
.dark .fdwc-tile-v { color: #f8fafc; }
/* Store home */
.fdwc-shortcuts { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 22px; }
.fdwc-shortcuts a { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 18px 8px; background: #fff; border: 1px solid #dcdcde; border-radius: 6px; color: #2271b1; font-size: 13px; font-weight: 500; text-align: center; }
.fdwc-shortcuts a:hover { border-color: #2271b1; background: #f6f7f7; }
.fdwc-home-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 22px; }
@media (max-width: 1100px) { .fdwc-home-grid { grid-template-columns: 1fr; } .fdwc-shortcuts { grid-template-columns: repeat(3, 1fr); } }
.fdwc-seg { display: inline-flex; border: 1px solid #c3c4c7; border-radius: 4px; overflow: hidden; }
.fdwc-seg button { font: inherit; font-size: 12px; padding: 5px 10px; background: #fff; border: 0; border-right: 1px solid #c3c4c7; cursor: pointer; color: #50575e; }
.fdwc-seg button:last-child { border-right: 0; } .fdwc-seg button.is-on { background: #2271b1; color: #fff; }
.fdwc-todo { list-style: none; margin: 0; padding: 0; }
.fdwc-todo a { display: flex; align-items: center; gap: 10px; padding: 11px 2px; border-bottom: 1px solid #f0f0f1; color: #1d2327; font-size: 14px; }
.fdwc-todo a:hover { color: #2271b1; } .fdwc-todo span { flex: 1; }
.fdwc-todo b { background: #d63638; color: #fff; border-radius: 999px; font-size: 12px; padding: 1px 9px; min-width: 24px; text-align: center; }
.fdwc-todo b.is-zero { background: #f0f0f1; color: #757575; }
.fdwc-lead { display: flex; align-items: baseline; gap: 8px; padding: 9px 0; border-bottom: 1px solid #f0f0f1; font-size: 14px; }
.fdwc-lead span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .fdwc-lead small { color: #757575; }
.dark .fdwc-shortcuts a { background: rgba(255,255,255,.03); border-color: rgba(255,255,255,.1); }
.dark .fdwc-todo a { color: #e2e8f0; border-color: rgba(255,255,255,.08); }