/* =============================================================================
   AstroPlanner – Stylesheet v1.6.23
   =============================================================================

   ANPASSUNG PER WORDPRESS "ZUSÄTZLICHES CSS"
   -------------------------------------------
   Alle visuellen Eigenschaften sind als CSS Custom Properties definiert.
   Füge folgenden Block in WordPress unter Darstellung → Zusätzliches CSS
   ein und passe nur die Zeilen an, die du ändern möchtest.

   .astrocamp-planner {

       Layout
       --acp-max-width:            960px;
       --acp-align:                center;       left | center | right
       --acp-table-align:          center;       left | center | right
       --acp-padding:              0px;

       Widget-Rahmen & Hintergrund
       --acp-widget-bg:            transparent;
       --acp-widget-border:        none;
       --acp-widget-border-radius: 0px;
       --acp-widget-shadow:        none;

       Typografie
       --acp-font-family:          -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
       --acp-font-size-base:       14px;
       --acp-font-size-table:      12px;
       --acp-font-size-label:      11px;
       --acp-font-size-info:       11px;
       --acp-color-text:           #2A3538;
       --acp-color-text-muted:     #5a6e72;

       Eingabefelder
       --acp-input-bg:             #FFF8E6;
       --acp-input-bg-readonly:    #f0eddf;
       --acp-input-border:         #c8c0a8;
       --acp-input-border-radius:  5px;
       --acp-input-focus-color:    #009DD4;
       --acp-input-height:         34px;
       --acp-input-font-size:      13px;

       Buttons
       --acp-btn-bg:               #009DD4;
       --acp-btn-bg-hover:         #007fac;
       --acp-btn-color:            #ffffff;
       --acp-btn-border:           #009DD4;
       --acp-btn-border-radius:    5px;
       --acp-btn-font-size:        13px;
       --acp-btn-shadow:           none;
       --acp-btn-secondary-bg:     #FFF8E6;
       --acp-btn-secondary-color:  #009DD4;
       --acp-btn-secondary-hover:  #e8f6fb;

       Tabelle: Rahmen & Hintergrund
       --acp-border-color:         #c8c0a8;
       --acp-border-width:         1px;
       --acp-th-bg:                #f0eddf;
       --acp-th-color:             #2A3538;
       --acp-td-time-bg:           #f0eddf;
       --acp-td-time-color:        #5a6e72;
       --acp-cell-min-width:       34px;
       --acp-cell-padding-v:       3px;
       --acp-cell-padding-h:       5px;

       Tabelle: Höhenwinkel-Farben
       --acp-color-gt60-bg:        #2d862d;    > 60 Grad
       --acp-color-gt60-text:      #ffffff;
       --acp-color-45-bg:          #5cb85c;    45-60 Grad
       --acp-color-45-text:        #ffffff;
       --acp-color-30-bg:          #b8d96a;    30-45 Grad
       --acp-color-30-text:        #1a1a1a;
       --acp-color-20-bg:          #e8c44a;    20-30 Grad
       --acp-color-20-text:        #1a1a1a;
       --acp-color-10-bg:          #e87a2a;    10-20 Grad
       --acp-color-10-text:        #1a1a1a;
       --acp-color-lt10-bg:        #c0392b;    unter 10 Grad
       --acp-color-lt10-text:      #ffffff;
       --acp-color-twilight-bg:    #3d7a6e;    astronomische Daemmerung (-18 bis -12 Grad)
       --acp-color-twilight-text:  #a0d0c8;
       --acp-color-bright-bg:      #4a6080;    zu hell (Sonne > -12 Grad)
       --acp-color-bright-text:    #a0b8d0;
       --acp-color-below-bg:       #2a2a3a;    unter Horizont
       --acp-color-below-text:     #666688;

       Legende
       --acp-legend-dot-size:      14px;
       --acp-legend-dot-radius:    3px;
   }

   BEISPIEL - zentriertes Widget mit Schatten und abgerundeten Ecken:
   .astrocamp-planner {
       --acp-align:                center;
       --acp-table-align:          center;
       --acp-widget-shadow:        0 4px 16px rgba(0,0,0,0.10);
       --acp-widget-bg:            #ffffff;
       --acp-widget-border:        1px solid #e0e0e0;
       --acp-widget-border-radius: 10px;
       --acp-padding:              20px;
   }

   ============================================================================= */

/* ── Reset ── */
.astrocamp-planner * { box-sizing: border-box; margin: 0; padding: 0; }

/* ── Heading ── */
.astrocamp-planner .acp-heading {
    margin-bottom: 16px;
    color: var(--acp-color-heading, #FFF8E6) !important;
}

/* ── Custom Properties: Standardwerte ── */
.astrocamp-planner {
    --acp-max-width:            960px;
    --acp-align:                center;
    --acp-table-align:          center;
    --acp-padding:              0px;

    --acp-widget-bg:            transparent;
    --acp-widget-border:        none;
    --acp-widget-border-radius: 0px;
    --acp-widget-shadow:        none;

    --acp-font-family:          -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --acp-font-size-base:       14px;
    --acp-font-size-table:      12px;
    --acp-font-size-label:      11px;
    --acp-font-size-info:       11px;
    --acp-color-text:           #2A3538;
    --acp-color-text-muted:     #5a6e72;

    --acp-input-bg:             #FFF8E6;
    --acp-input-bg-readonly:    #f0eddf;
    --acp-input-border:         #c8c0a8;
    --acp-input-border-radius:  5px;
    --acp-input-focus-color:    #009DD4;
    --acp-input-height:         34px;
    --acp-input-font-size:      13px;

    --acp-btn-bg:               #009DD4;
    --acp-btn-bg-hover:         #007fac;
    --acp-btn-color:            #ffffff;
    --acp-btn-border:           #009DD4;
    --acp-btn-border-radius:    5px;
    --acp-btn-font-size:        13px;
    --acp-btn-shadow:           none;
    --acp-btn-secondary-bg:     #FFF8E6;
    --acp-btn-secondary-color:  #009DD4;
    --acp-btn-secondary-hover:  #e8f6fb;

    --acp-border-color:         #c8c0a8;
    --acp-border-width:         1px;
    --acp-th-bg:                #f0eddf;
    --acp-th-color:             #2A3538;
    --acp-td-time-bg:           #f0eddf;
    --acp-td-time-color:        #5a6e72;
    --acp-cell-min-width:       34px;
    --acp-cell-padding-v:       3px;
    --acp-cell-padding-h:       5px;

    --acp-color-gt60-bg:        #2d862d;
    --acp-color-gt60-text:      #ffffff;
    --acp-color-45-bg:          #5cb85c;
    --acp-color-45-text:        #ffffff;
    --acp-color-30-bg:          #b8d96a;
    --acp-color-30-text:        #1a1a1a;
    --acp-color-20-bg:          #e8c44a;
    --acp-color-20-text:        #1a1a1a;
    --acp-color-10-bg:          #e87a2a;
    --acp-color-10-text:        #1a1a1a;
    --acp-color-lt10-bg:        #c0392b;
    --acp-color-lt10-text:      #ffffff;
    --acp-color-bright-bg:      #4a6080;
    --acp-color-bright-text:    #a0b8d0;
    --acp-color-below-bg:       #2a2a3a;
    --acp-color-below-text:     #666688;

    --acp-legend-dot-size:      14px;
    --acp-legend-dot-radius:    3px;

    /* Angewandte Eigenschaften */
    font-family:    var(--acp-font-family);
    font-size:      var(--acp-font-size-base);
    color:          var(--acp-color-text);
    max-width:      var(--acp-max-width);
    padding:        var(--acp-padding);
    background:     var(--acp-widget-bg);
    border:         var(--acp-widget-border);
    border-radius:  var(--acp-widget-border-radius);
    box-shadow:     var(--acp-widget-shadow);
}

/* ── Widget-Ausrichtung ── */
.astrocamp-planner                { margin-inline: auto; }
.astrocamp-planner.acp-center     { margin-inline: auto; }
.astrocamp-planner.acp-right      { margin-inline: auto 0; }


/* ── Meridian Transit Bar ── */
.acp-transit-bar {
    font-size:     var(--acp-font-size-label);
    color:         var(--acp-color-text-muted);
    margin-bottom: 10px;
    padding:       6px 10px;
    background:    var(--acp-td-time-bg);
    border-left:   3px solid var(--acp-color-text-muted);
    border-radius: 0 var(--acp-input-border-radius) var(--acp-input-border-radius) 0;
    line-height:   1.6;
}
.acp-transit-bar strong { color: var(--acp-color-text); }
.acp-transit-label { margin-right: 6px; }
.acp-transit-line-swatch {
    display:       inline-block;
    width:         2px;
    height:        14px;
    background:    var(--acp-color-transit-line, rgba(254,0,0,0.7));
    margin-right:  6px;
    vertical-align: middle;
    border-radius: 1px;
}
.acp-transit-ok   { background: var(--acp-color-gt60-bg);  color: #fff; font-size: 10px; padding: 1px 5px; border-radius: 3px; }
.acp-transit-warn { background: var(--acp-color-bright-bg); color: var(--acp-color-bright-text); font-size: 10px; padding: 1px 5px; border-radius: 3px; }

/* ── Vertical transit line in table cells ── */
.acp-transit-line {
    position:   absolute;
    top:        0;
    bottom:     0;
    width:      2px;
    background: var(--acp-color-transit-line, rgba(254,0,0,0.7));
    pointer-events: none;
    z-index:    2;
}

/* ── Controls ── */
.acp-controls { display: flex; flex-direction: column; gap: 12px; margin-top: 24px; margin-bottom: 24px; }
.acp-row      { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; }
.acp-group    { display: flex; flex-direction: column; gap: 3px; }

.acp-group label {
    font-size:      var(--acp-font-size-label);
    color:          var(--acp-color-text-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.acp-group input,
.acp-group select {
    font-size:     var(--acp-input-font-size);
    padding:       6px 8px;
    border:        var(--acp-border-width) solid var(--acp-input-border);
    border-radius: var(--acp-input-border-radius);
    background:    var(--acp-input-bg);
    color:         var(--acp-color-text);
    height:        var(--acp-input-height);
}
.acp-group input:focus,
.acp-group select:focus {
    outline:       2px solid var(--acp-input-focus-color);
    outline-offset: 1px;
    border-color:  var(--acp-input-focus-color);
}
.acp-group input[readonly] {
    background: var(--acp-input-bg-readonly);
    color:      var(--acp-color-text-muted);
}

/* ── Buttons ── */
.acp-btn {
    padding:       6px 16px;
    height:        var(--acp-input-height);
    font-size:     var(--acp-btn-font-size);
    border:        var(--acp-border-width) solid var(--acp-btn-border);
    border-radius: var(--acp-btn-border-radius);
    background:    var(--acp-btn-bg);
    color:         var(--acp-btn-color);
    box-shadow:    var(--acp-btn-shadow);
    cursor:        pointer;
    white-space:   nowrap;
    align-self:    flex-end;
    transition:    background .15s;
}
.acp-btn:hover { background: var(--acp-btn-bg-hover); }

.acp-btn.secondary {
    background:   var(--acp-btn-secondary-bg);
    color:        var(--acp-btn-secondary-color);
    border-color: var(--acp-btn-border);
}
.acp-btn.secondary:hover { background: var(--acp-btn-secondary-hover); }

/* ── Advanced section rows ── */
.acp-adv-row {
    flex-direction: column;
    align-items:    stretch;
    gap:            6px;
    width:          100%;
    margin-top:     20px;
}
.acp-adv-section-label {
    font-size:      var(--acp-font-size-label);
    text-transform: uppercase;
    letter-spacing: .06em;
    color:          var(--acp-btn-bg);
    font-weight:    600;
    padding-bottom: 2px;
    border-bottom:  1px solid var(--acp-border-color);
}
.acp-adv-fields {
    display:     flex;
    flex-wrap:   wrap;
    gap:         8px;
    align-items: flex-end;
}

/* ── Advanced toggle ── */
.acp-toggle-btn {
    align-self:    flex-end;
    height:        var(--acp-input-height);
    padding:       6px 12px;
    font-size:     var(--acp-btn-font-size);
    background:    var(--acp-btn-bg);
    color:         var(--acp-btn-color);
    border-color:  var(--acp-btn-border);
    white-space:   nowrap;
}
.acp-toggle-btn:hover { background: var(--acp-btn-bg-hover); }
.acp-advanced {
    border-top:    1px solid var(--acp-border-color);
    border-bottom: 1px solid var(--acp-border-color);
    padding-top:   10px;
    padding-bottom: 16px;
    margin-top:    4px;
}

/* ── Filter squares ── */
.acp-filter-squares { display: inline-flex; gap: 3px; vertical-align: middle; margin-left: 4px; }
.acp-fsq {
    display:       inline-block;
    width:         13px;
    height:        13px;
    border-radius: 2px;
    cursor:        pointer;
    border:        1px solid transparent;
    transition:    transform .12s, box-shadow .12s;
    vertical-align: middle;
}
.acp-fsq:hover          { transform: scale(1.2); }
.acp-fsq.acp-fsq-active { box-shadow: 0 0 0 2px var(--acp-color-text); transform: scale(1.15); }
.acp-fsq-reset {
    background:    var(--acp-input-bg) !important;
    border:        1px solid var(--acp-border-color) !important;
    color:         var(--acp-color-text-muted);
    font-size:     10px;
    line-height:   13px;
    text-align:    center;
    font-weight:   bold;
}

/* ── Sort toggle ── */
.acp-sort-toggle { display: inline-flex; gap: 3px; vertical-align: middle; margin-left: 4px; }
.acp-sort-btn {
    font-size:     10px;
    padding:       1px 6px;
    border:        1px solid var(--acp-input-border);
    border-radius: 3px;
    background:    var(--acp-input-bg);
    color:         var(--acp-color-text-muted);
    cursor:        pointer;
    line-height:   1.4;
}
.acp-sort-btn.active {
    background:  var(--acp-btn-bg);
    color:       var(--acp-btn-color);
    border-color:var(--acp-btn-border);
}
.acp-sort-btn:hover:not(.active) { background: var(--acp-btn-secondary-hover); }

/* ── Lookup Status ── */
.acp-lookup-status         { font-size: var(--acp-font-size-label); height: 18px; }
.acp-lookup-status.loading { color: #888; }
.acp-lookup-status.ok      { color: var(--acp-color-gt60-bg); }
.acp-lookup-status.err     { color: var(--acp-color-lt10-bg); }

/* ── Koordinaten ── */
.acp-coords { display: flex; gap: 6px; }

/* ── Legend inline info + copy button ── */
.acp-leg-spacer    { flex: 1; min-width: 12px; }
.acp-info-inline   { font-size: var(--acp-font-size-label); color: var(--acp-color-text-muted); flex-wrap: wrap; gap: 4px; }
.acp-info-inline strong { color: var(--acp-color-text); }
.acp-copy-btn      { padding: 2px 10px; height: auto; font-size: var(--acp-font-size-label); align-self: auto; }

/* ── Tabellen-Ausrichtung ── */
.acp-table-wrap {
    overflow-x:    auto;
    margin-bottom: 12px;
    display:       flex;
    justify-content: var(--acp-table-align);
}

/* ── Tabelle ── */
.acp-table {
    border-collapse: collapse;
    font-size:       var(--acp-font-size-table);
    min-width:       560px;
}

.acp-table th {
    padding:     4px 6px;
    text-align:  center;
    color:       var(--acp-th-color);
    font-weight: 500;
    white-space: nowrap;
    background:  var(--acp-th-bg);
    border:      var(--acp-border-width) solid var(--acp-border-color);
}
.acp-table th.time-col { text-align: right; padding-right: 4px; width: 1%; white-space: nowrap; }

.acp-table td {
    padding:     var(--acp-cell-padding-v) var(--acp-cell-padding-h);
    text-align:  center;
    min-width:   var(--acp-cell-min-width);
    border:      var(--acp-border-width) solid var(--acp-border-color);
    font-weight: 500;
}

.acp-table td.time-lbl {
    text-align:    right;
    padding-right: 4px;
    color:         var(--acp-td-time-color);
    font-weight:   400;
    background:    var(--acp-td-time-bg);
    white-space:   nowrap;
}

/* ── Zellfarben via data-Attribut (gesetzt durch JS) ── */
.acp-table td[data-alt="gt60"]   { background: var(--acp-color-gt60-bg);   color: var(--acp-color-gt60-text);   }
.acp-table td[data-alt="45"]     { background: var(--acp-color-45-bg);     color: var(--acp-color-45-text);     }
.acp-table td[data-alt="30"]     { background: var(--acp-color-30-bg);     color: var(--acp-color-30-text);     }
.acp-table td[data-alt="20"]     { background: var(--acp-color-20-bg);     color: var(--acp-color-20-text);     }
.acp-table td[data-alt="10"]     { background: var(--acp-color-10-bg);     color: var(--acp-color-10-text);     }
.acp-table td[data-alt="lt10"]   { background: var(--acp-color-lt10-bg);   color: var(--acp-color-lt10-text);   }
.acp-table td[data-alt="bright"]  { background: var(--acp-color-bright-bg); color: var(--acp-color-bright-text); }
.acp-table td[data-alt="below"]  { background: var(--acp-color-below-bg);  color: var(--acp-color-below-text);  }


/* ── UTC-Offset-Zeile ── */
.acp-tz-lbl  { font-size: 10px; color: var(--acp-color-text-muted); }
.acp-tz-cell { font-size: 10px; color: var(--acp-color-text-muted); background: var(--acp-td-time-bg); border: var(--acp-border-width) solid var(--acp-border-color); }

/* ── Legende ── */
.acp-legend-wrap  { margin-top: 8px; }
.acp-legend-label {
    font-size:      var(--acp-font-size-label);
    text-transform: uppercase;
    letter-spacing: .06em;
    color:          var(--acp-btn-bg);
    font-weight:    600;
    margin-bottom:  4px;
}
.acp-legend   { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }
.acp-leg-item { display: flex; align-items: center; gap: 5px; font-size: var(--acp-font-size-label); color: var(--acp-color-text-muted); }
.acp-leg-dot  { width: var(--acp-legend-dot-size); height: var(--acp-legend-dot-size); border-radius: var(--acp-legend-dot-radius); flex-shrink: 0; }
.acp-leg-dot.gt60   { background: var(--acp-color-gt60-bg);   }
.acp-leg-dot.d45    { background: var(--acp-color-45-bg);     }
.acp-leg-dot.d30    { background: var(--acp-color-30-bg);     }
.acp-leg-dot.d20    { background: var(--acp-color-20-bg);     }
.acp-leg-dot.d10    { background: var(--acp-color-10-bg);     }
.acp-leg-dot.lt10   { background: var(--acp-color-lt10-bg);   }
.acp-leg-dot.bright { background: var(--acp-color-bright-bg); }
.acp-leg-dot.below  { background: var(--acp-color-below-bg);  }


/* ── Fehlermeldung ── */
.acp-error {
    font-size:     var(--acp-font-size-base);
    color:         var(--acp-color-lt10-bg);
    padding:       8px 12px;
    background:    #fff0ee;
    border-left:   3px solid var(--acp-color-lt10-bg);
    border-radius: var(--acp-input-border-radius);
    margin:        8px 0;
}

/* ── Mobile: kompakte Tabelle für kleine Displays (≤ 430px) ── */
@media (max-width: 430px) {
    .acp-coords { flex-wrap: nowrap; }
    .acp-table-wrap {
        justify-content: flex-start;
    }
    .acp-table {
        font-size: 10px;
        min-width: unset;
        width:     100%;
    }
    .acp-table td {
        min-width:  0;
        width:      auto;
        padding:    2px 1px;
    }
    .acp-table th {
        padding:    3px 1px;
        font-size:  10px;
        min-width:  0;
    }
    .acp-table th.time-col,
    .acp-table td.time-lbl {
        padding-right: 3px;
        padding-left:  2px;
        font-size:     9px;
        white-space:   nowrap;
        width:         1%;
    }
    .acp-tz-cell,
    .acp-tz-lbl {
        font-size: 8px;
    }
    .acp-legend {
        gap: 6px;
    }
    .acp-leg-item {
        font-size: 10px;
    }
    .acp-transit-bar {
        font-size: 10px;
    }
    .acp-info-inline {
        font-size: 10px;
        flex-wrap: wrap;
    }
}

/* ── Promo bar (specific object shortcode) ── */
.acp-promo-bar {
    display: block;
    background: #FF0000;
    color: #FFF8E7;          /* Cosmic Latte */
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 5px 16px;
    margin: 6px 0 10px;
    border-radius: 3px;
    line-height: 1.4;
}
.acp-promo-bar a {
    color: #FFF8E7;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 2px;
}
.acp-promo-bar a:hover {
    color: #ffffff;
    text-decoration-color: #ffffff;
}

/* ── Plugin closing line ── */
.astrocamp-planner {
    border-bottom: 1px solid var(--acp-border-color);
    padding-bottom: 16px;
}