/* ============================================================
   Header Footer / Theme Builder — Admin Styles
   Professional, subtle palette. Teal anchor: #083d49 / #1c718a
   ============================================================ */

/* ── Global WP fix ── */
.wp-core-ui select { padding: 0 23px 0 8px !important; }

/* ============================================================
   LISTING PAGE — PANEL WRAPPER (visual card around tabs + table)
   ============================================================ */

/* Panel wrapper that JS injects around the subsubsub + list table */
.sits-builder-panel-wrap {
    background: #fff;
    border: 1px solid #c3c4c7;
    border-top: none;                   /* tabs sit flush on top */
    border-radius: 0 0 4px 4px;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    overflow: hidden;
}

/* ============================================================
   LISTING PAGE — TYPE TABS (underline indicator style)
   ============================================================ */
p.search-box {
padding: 0 10px !important;
}  
#sits-type-tabs-container,
.sits-type-tabs-wrap {
    display: flex !important;
    flex-wrap: wrap;
    align-items: flex-end !important;
    gap: 0 !important;
    padding: 0 14px !important;
    margin: 8px 0 0 !important;
    border: 1px solid #c3c4c7 !important;
    border-bottom: 2px solid #e2e8ef !important;
    box-shadow: none !important;
    background: #f8f9fa !important;
    border-left: 1px solid #c3c4c7 !important;
    border-radius: 4px 4px 0 0;
    position: relative;
    z-index: 2;
}
a:focus,
button:focus,
.elementor-tab-title:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* Individual tab */
.sits-type-tab {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 10px 16px 9px !important;
    margin-bottom: -2px !important;
    border-radius: 0 !important;
    border: none !important;
    border-bottom: 3px solid transparent !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #6b7a85 !important;
    background: transparent !important;
    text-decoration: none !important;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.5 !important;
}

.sits-type-tab:hover {
    color: #1c718a !important;
    background: rgba(28,113,138,.06) !important;
    border-bottom-color: #b0d4de !important;
    border: none !important;
    border-bottom: 3px solid #b0d4de !important;
    text-decoration: none !important;
}

/* Active tab: teal underline, white bg, merges with content below */
.sits-type-tab--active,
.sits-type-tab--active:hover {
    color: #0f3d4a !important;
    font-weight: 700 !important;
    background: #ffffff !important;
    border: none !important;
    border-bottom: 3px solid #1c718a !important;
    margin-bottom: -2px !important;
    text-decoration: none !important;
}

/* Colour-coded dots inside each tab */
.sits-tab-dot {
    display: inline-block;
    width: 7px; height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 1px;
    opacity: .8;
}
.sits-tab-dot-all          { background: #6b7a85; }
.sits-tab-dot-header       { background: #1565c0; }
.sits-tab-dot-footer       { background: #6a1fa2; }
.sits-tab-dot-archive      { background: #2e7d32; }
.sits-tab-dot-single_page  { background: #e65100; }
.sits-tab-dot-single_post  { background: #880e4f; }
.sits-tab-dot-404_page     { background: #bf360c; }

/* ── Sub-header (WP status views: All/Published/Drafts/Trash) ── */
.post-type-sits_hf_template .subsubsub {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 !important;
    padding: 8px 16px !important;
    margin: 0 !important;
    border: none !important;
    border-bottom: 1px solid #eaeff2 !important;
    background: #fcfcfd !important;
    list-style: none !important;
}
.post-type-sits_hf_template .subsubsub li {
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
}
.post-type-sits_hf_template .subsubsub li::after  { display: none !important; }
.post-type-sits_hf_template .subsubsub li a {
    font-size: 12.5px !important;
    padding: 2px 5px !important;
    color: #4a6270 !important;
    text-decoration: none !important;
    border-radius: 3px;
}
.post-type-sits_hf_template .subsubsub li a:hover { color: #1c718a !important; }
.post-type-sits_hf_template .subsubsub li a.current { color: #0f3d4a !important; font-weight: 600 !important; }
.post-type-sits_hf_template .subsubsub li .count   { color: #90a0a8; font-size: 11px; }
.post-type-sits_hf_template .subsubsub li .sep     {
    color: #ccc !important; padding: 0 3px !important; font-size: 12px !important;
}

/* ── Tablenav / filter row ── */
.post-type-sits_hf_template .tablenav {
    background: #fcfcfd;
    padding: 8px 14px !important;
    border-bottom: 1px solid #eaeff2;
    margin: 0 !important;
}
.post-type-sits_hf_template .tablenav.bottom {
    border-bottom: none !important;
    border-top: 1px solid #eaeff2;
}

/* ── List table enhancements ── */
.post-type-sits_hf_template .wp-list-table {
    border: none !important;
    margin: 0 !important;
}
.post-type-sits_hf_template .wp-list-table thead th,
.post-type-sits_hf_template .wp-list-table tfoot th {
    background: #f5f8fa !important;
    border-bottom: 2px solid #e2e8ef !important;
    font-weight: 600 !important;
    color: #3d4f57 !important;
    font-size: 12px !important;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 10px 14px !important;
}
.post-type-sits_hf_template .wp-list-table tbody tr {
    border-bottom: 1px solid #f0f3f5 !important;
    transition: background 0.1s;
}
.post-type-sits_hf_template .wp-list-table tbody tr:hover { background: #f6fafc !important; }
.post-type-sits_hf_template .wp-list-table tbody tr td {
    padding: 12px 14px !important;
    vertical-align: middle !important;
}
.post-type-sits_hf_template .wp-list-table .column-title strong a {
    color: #1c718a !important;
    font-weight: 600 !important;
    font-size: 13.5px;
}
.post-type-sits_hf_template .wp-list-table .column-title strong a:hover {
    color: #0f3d4a !important;
    text-decoration: underline;
}
.post-type-sits_hf_template #the-list td { border-left: none !important; }

/* ============================================================
   ADD NEW TEMPLATE BUTTON
   ============================================================ */

.post-type-sits_hf_template .page-title-action,
.post-type-sits_hf_template a.page-title-action {
    padding: 5px 10px !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    background: linear-gradient(45deg, #1c718a -10%, #103d4a 50.71%) !important;
    text-decoration: none !important;
    transition: opacity 0.15s, box-shadow 0.15s !important;
    box-shadow: 0 2px 6px rgba(8,61,73,0.18) !important;
    margin-left: 10px !important;
}
.post-type-sits_hf_template .page-title-action:hover,
.post-type-sits_hf_template a.page-title-action:hover {
    opacity: 0.88 !important;
    box-shadow: 0 4px 12px rgba(8,61,73,0.26) !important;
}

/* ============================================================
   EMPTY STATE
   ============================================================ */

.sits-empty-state {
    display: flex; flex-direction: column; align-items: center;
    justify-content: center; padding: 60px 20px; text-align: center;
    background: #fff; border: 1px solid #e5ebed; border-radius: 8px; margin-top: 20px;
}
.sits-empty-state-icon   { width: 90px; margin-bottom: 20px; opacity: 0.55; }
.sits-empty-state h3     { font-size: 18px; font-weight: 600; color: #2d4a54; margin: 0 0 8px; }
.sits-empty-state p      { font-size: 13px; color: #7a9099; margin: 0 0 20px; max-width: 340px; line-height: 1.6; }

/* ============================================================
   TEMPLATE TYPE BADGE
   ============================================================ */

.sits-hf-type {
    display: inline-block; padding: 3px 9px; border-radius: 4px;
    font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em;
}
.sits-hf-type-header      { background: #e3f2fd; color: #1565c0; }
.sits-hf-type-footer      { background: #f3e5f5; color: #6a1fa2; }
.sits-hf-type-archive     { background: #e8f5e9; color: #2e7d32; }
.sits-hf-type-single_page { background: #fff3e0; color: #e65100; }
.sits-hf-type-single_post { background: #fce4ec; color: #880e4f; }
.sits-hf-type-404_page    { background: #fbe9e7; color: #bf360c; }

/* ============================================================
   STATUS BADGE
   ============================================================ */

.sits-hf-status-badge         { display: inline-block; padding: 3px 9px; border-radius: 4px; font-size: 11px; font-weight: 600; }
.sits-hf-status-badge.sits-active   { background: #d4edda; color: #155724; }
.sits-hf-status-badge.sits-inactive { background: #f8d7da; color: #721c24; }

/* ============================================================
   COLUMN WIDTHS
   ============================================================ */

.column-sits_hf_type    { width: 120px; }
.column-sits_hf_status  { width: 100px; }
.column-sits_hf_display { width: 200px; }

/* ============================================================
   META BOX
   ============================================================ */

.sits-hf-settings p { margin-bottom: 15px; }
.sits-hf-activation-status {
    padding: 14px; background: #f6fafb; border: 1px solid #d0e5ea;
    border-radius: 5px; margin-top: 14px;
}
.sits-status-active   { color: #177d32; font-weight: 600; }
.sits-status-inactive { color: #999; }
.sits-status-active .dashicons,
.sits-status-inactive .dashicons { vertical-align: middle; }

/* ============================================================
   DISPLAY RULES META BOX
   ============================================================ */

.sits-hf-display-rules h4     { margin-top: 20px; margin-bottom: 10px; font-size: 14px; font-weight: 600; }
.sits-hf-display-rules p      { margin-bottom: 10px; }
.sits-hf-display-rules label  { display: inline-block; cursor: pointer; }
.sits-hf-display-rules input[type="checkbox"] { margin-right: 8px; }
.sits-hf-display-rules hr     { margin: 28px 0; border: 0; border-top: 1px solid #dde; }

/* ============================================================
   ACTIVATE BUTTON
   ============================================================ */

.sits-activate-template            { margin-top: 10px; }
.sits-activate-template.loading    { opacity: 0.6; pointer-events: none; }
@keyframes sits-spin { to { transform: rotate(360deg); } }

/* ============================================================
   NOTICE MESSAGES
   ============================================================ */

.sits-hf-success { padding: 10px 15px; background: #d4edda; border-left: 4px solid #28a745; color: #155724; margin: 15px 0; border-radius: 3px; }
.sits-hf-error   { padding: 10px 15px; background: #f8d7da; border-left: 4px solid #dc3545; color: #721c24; margin: 15px 0; border-radius: 3px; }

/* ============================================================
   MODAL OVERLAY
   ============================================================ */

.sits-pub-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,.55);
    z-index: 999999; display: flex; align-items: center; justify-content: center;
    opacity: 0; transition: opacity .25s ease;
}
.sits-pub-overlay.sits-pub-overlay--visible { opacity: 1; }

/* ============================================================
   MODAL BOX
   ============================================================ */

.sits-pub-modal {
    background: #e8e8ee;
    width: 610px; max-width: calc(100vw - 40px); max-height: calc(100vh - 60px);
    display: flex; flex-direction: column;
    box-shadow: 0 24px 64px rgba(0,0,0,.45);
    overflow: hidden;
    transform: translateY(14px); transition: transform .25s ease;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #0d3440;
}
.sits-pub-overlay--visible .sits-pub-modal { transform: translateY(0); }

.sits-pub-modal-header {
    display: flex; align-items: center; gap: 10px; padding: 16px 22px;
    border-bottom: 1px solid rgba(255,255,255,.2); flex-shrink: 0;
    background: #083d49;
}
.sits-pub-modal-header h2 {
    flex: 1; font-size: 12px; font-weight: 700; letter-spacing: .14em;
    text-transform: uppercase; color: #fff; margin: 0; padding: 0;
}
.sits-pub-modal-icon     { font-size: 17px; color: rgba(255,255,255,.8); }
.sits-pub-modal-close    { background: none; border: none; color: rgba(255,255,255,.8); font-size: 20px; line-height: 1; cursor: pointer; padding: 0 2px; transition: color .15s; }
.sits-pub-modal-close:hover { color: #fff; }

.sits-pub-modal-body     { padding: 20px 22px; overflow-y: auto; flex: 1; max-height: calc(80vh - 120px); background: #f5f8fa; }

.sits-pub-section        { display: flex; align-items: flex-start; gap: 14px; padding: 14px 0;}
.sits-pub-section:first-child  { padding-top: 0; }
.sits-pub-section:last-of-type { border-bottom: none; }

.sits-pub-section-icon   { width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; flex-shrink: 0; margin-top: 2px; color: #fff; }
.sits-icon-type   { background: #a78bfa; }
.sits-icon-cond   { background: #34d399; }
.sits-icon-title  { background: #60a5fa; font-size: 15px; }

.sits-pub-section-content { flex: 1; min-width: 0; }
.sits-pub-section-label   { display: block; font-size: 12.5px; font-weight: 600; color: #0d3440; margin-bottom: 7px; }
.sits-pub-section-desc    { font-size: 11.5px; color: #7a9099; margin: 0 0 12px; line-height: 1.6; }

.sits-pub-type-select     { width: 100%; background: #fff; border: 1px solid #c8d8de; border-radius: 6px; color: #0d3440; padding: 8px 12px; font-size: 13px; cursor: pointer; appearance: auto; }
.sits-pub-type-select:focus { outline: none; border-color: #1c718a; }

.sits-pub-condition-row   { display: flex; align-items: center; gap: 8px; border-radius: 6px; margin-bottom: 8px; flex-wrap: wrap; }

.sits-pub-include-exclude,
.sits-pub-condition-type  { background: #fff; border: 1px solid #c8d8de; border-radius: 5px; color: #0d3440; padding: 7px 10px; font-size: 12px; cursor: pointer; flex-shrink: 0; }
.sits-pub-include-exclude { width: 100px; }
.sits-pub-condition-type  { flex: 1; min-width: 150px; }
.sits-pub-include-exclude:focus,
.sits-pub-condition-type:focus { outline: none; border-color: #1c718a; }

.sits-pub-remove-row      { background: none; border: 1px solid rgb(255 2 2 / 86%); border-radius: 5px; color: #ff0000; font-size: 16px; line-height: 1; cursor: pointer; padding: 4px 9px; flex-shrink: 0; transition: background .15s; }
.sits-pub-remove-row:hover { background: rgba(220,60,60,.08); }

.sits-pub-singular-specific { width: 100%; border-top: 1px solid #e4ecf0; padding-top: 8px; }
.sits-pub-search-specific   { width: 100%; background: #fff; border: 1px solid #c8d8de; border-radius: 5px; color: #0d3440; padding: 7px 10px; font-size: 12px; box-sizing: border-box; }
.sits-pub-search-specific:focus { outline: none; border-color: #1c718a; }
.sits-pub-search-results    { background: #fff; border: 1px solid #c8d8de; border-top: none; border-radius: 0 0 5px 5px; max-height: 160px; overflow-y: auto; }
.sits-pub-search-result-item { padding: 8px 12px; cursor: pointer; border-bottom: 1px solid #f0f5f7; font-size: 12px; transition: background .1s; }
.sits-pub-search-result-item:hover { background: #e8f4f8; }
.sits-pub-search-result-item strong { color: #0d3440; }
.sits-pub-search-result-item em     { color: #7a9099; }
.sits-pub-no-results { padding: 8px 12px; color: #7a9099; font-size: 12px; }

.sits-pub-specific-list  { margin-top: 8px; }
.sits-pub-specific-item  { display: flex; justify-content: space-between; align-items: center; background: #e6f7f0; border: 1px solid #b8e6d4; border-radius: 5px; padding: 6px 10px; margin-bottom: 5px; font-size: 12px; }
.sits-pub-specific-item strong { color: #0d3440; }
.sits-pub-specific-item em     { color: #5a7a85; }
.sits-pub-remove-specific { background: none; border: none; color: #e03030; cursor: pointer; font-size: 16px; line-height: 1; padding: 0 2px; }

.sits-pub-add-cond-btn { display: inline-flex; align-items: center; gap: 6px; background: none; border: 1px dashed #1c718a; border-radius: 5px; color: #1c718a; padding: 7px 14px; font-size: 12px; font-weight: 600; cursor: pointer; transition: border-color .15s, background .15s; width: 100%; justify-content: center; margin-top: 4px; }
.sits-pub-add-cond-btn:hover { border-color: #0d3440; background: rgba(28,113,138,.06); color: #0d3440; }
.sits-pub-add-cond-btn .dashicons { font-size: 16px; width: 16px; height: 16px; line-height: 1; }

.sits-pub-error-msg  { background: rgb(237 56 56 / 12%); border: 1px solid rgb(255 0 0 / 45%); border-radius: 5px; color: #ff0000; padding: 10px 14px; font-size: 12px; margin-top: 14px; line-height: 1.5; }
.sits-err-icon       { margin-right: 6px; }

.sits-pub-modal-footer  { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 22px; border-top: 1px solid #e4ecf0; flex-shrink: 0; background: #083d49; }
.sits-pub-btn           { padding: 8px 20px; border-radius: 6px; font-size: 13px; font-weight: 600; cursor: pointer; border: none; transition: background .15s, opacity .15s; }
.sits-pub-cancel-btn    { background: rgba(255, 255, 255, .08); color: #ffffff;}
.sits-pub-cancel-btn:hover { background: rgba(255, 255, 255, .14); }
.sits-pub-save-btn {
    padding: 9px 20px;
    color: #083d49;
    border: none;
    border-radius: 4px;
    font-size: 13px;
    background: #ffffff;
    cursor: pointer; font-weight: 600;
    transition: opacity .15s, box-shadow .15s;
}
.sits-pub-save-btn:hover   { opacity: 0.88; box-shadow: 0 4px 12px rgba(8,61,73,.25); }
.sits-pub-save-btn:disabled { opacity: .5; cursor: not-allowed; }

.sits-open-settings   { color: #1c718a; }

.sits-pub-force-save-wrap { margin-top: 12px; }
.sits-pub-force-save-wrap label { display: flex; align-items: flex-start; gap: 8px; color: #0d3440; font-size: 12px; cursor: pointer; line-height: 1.5; }
.sits-pub-force-save-wrap input[type="checkbox"] { margin-top: 2px; flex-shrink: 0; }

.sits-pub-archive-sub { background: #fff; border: 1px solid #c8d8de; border-radius: 5px; color: #0d3440; padding: 7px 10px; font-size: 12px; cursor: pointer; flex-shrink: 0; min-width: 140px; flex: 1; }
.sits-pub-archive-sub:focus { outline: none; border-color: #1c718a; }

.sits-pub-template-title { background: #fff !important; border: 1px solid #c8d8de !important; border-radius: 6px !important; color: #0d3440 !important; padding: 8px 12px !important; font-size: 13px !important; width: 100% !important; box-sizing: border-box; transition: border-color .15s; }
.sits-pub-template-title:focus { outline: none !important; border-color: #1c718a !important; }
.sits-pub-template-title::placeholder { color: rgba(13,52,64,0.45); }

@media screen and (max-width: 782px) {
    .sits-type-tab { font-size: 11px; padding: 4px 11px; }
    .sits-hf-type, .sits-hf-status-badge { font-size: 10px; padding: 2px 7px; }
}