/* =======================================================
   Staff — POS Search Styles (Dark Theme)
   ======================================================= */

.pos-search {
    background-color: #111111;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    border: 1px solid #222222;
    font-family: inherit;
    margin-bottom: 32px;
}

.pos-search__header {
    margin-bottom: 24px;
}

.pos-search__title {
    font-size: 18px;
    font-weight: 700;
    color: #ffffff;
    margin: 0;
}

.pos-search__title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 24px;
}

.pos-search__quick-btns {
    display: flex;
    gap: 8px;
}

.pos-search__quick-btn {
    padding: 4px 12px;
    background: var(--mf-color-surface);
    color: var(--mf-color-base);
    border: 1px solid var(--mf-color-border, #444);
    border-radius: 6px;
    font-size: var(--mf-text-xs);
    font-weight: 600;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: background 0.15s;
}

.pos-search__quick-btn:hover,
.pos-search__quick-btn--active {
    background: var(--mf-color-brand);
    color: #fff;
    border-color: var(--mf-color-brand);
}

.pos-search__quick-btn--reset {
    background: transparent;
    color: var(--mf-color-gray-text);
    border-color: transparent;
    padding: 6px 10px;
}

.pos-search__quick-btn--reset:hover {
    background: var(--mf-color-danger, #ef4444);
    color: #fff;
    border-color: var(--mf-color-danger, #ef4444);
}

.pos-search__archiv-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 24px;
}

.pos-search__date-input {
    padding: 8px 12px;
    background: var(--mf-color-surface);
    color: var(--mf-color-base);
    border: 1px solid var(--mf-color-border, #444);
    border-radius: 6px;
    font-size: var(--mf-text-sm);
    flex: 1;
    -webkit-appearance: auto;
    appearance: auto;
    cursor: pointer;
    color-scheme: dark;
}

.pos-search__date-sep {
    color: var(--mf-color-gray-text);
    font-size: var(--mf-text-sm);
}

.pos-download__btn {
    padding: 6px 14px;
    background: var(--mf-color-surface);
    color: var(--mf-color-base);
    border: 1px solid var(--mf-color-border, #444);
    border-radius: 6px;
    font-size: var(--mf-text-xs);
    font-weight: 600;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: background 0.15s;
    align-self: stretch;
}

.pos-download__btn:hover {
    background: var(--mf-color-brand);
    color: #fff;
    border-color: var(--mf-color-brand);
}

.pos-search__row {
    display: flex;
    gap: 12px;
}

input.pos-search__input {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #333333;
    border-radius: 6px;
    font-size: 20px;
    background-color: #222222;
    color: #ffffff;
    transition: border-color 0.2s, background-color 0.2s, box-shadow 0.2s;
    outline: none;
    box-shadow: none;
}

.pos-search__input::placeholder {
    color: #888888;
}

.pos-search__input:focus {
    background-color: #1a1a1a;
    border-color: var(--mf-color-brand, #FF3C00);
    box-shadow: 0 0 0 1px var(--mf-color-brand, #FF3C00);
}

.pos-search__btn {
    padding: 0 24px;
    background-color: var(--mf-color-brand, #FF3C00);
    color: #ffffff;
    border: none;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: opacity 0.2s;
}

.pos-search__btn:hover {
    opacity: 0.9;
}

/* Table Styles */
.pos-search__table-wrap {
    overflow-x: auto;
}

.pos-search__table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    text-align: left;
    table-layout: fixed;
}

.pos-search__table th {
    color: #888888;
    font-weight: 600;
    font-size: 11px;
    line-height: 1.5em;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 12px 8px;
    border-bottom: 2px solid #333333;
}

.pos-search__cell {
    padding: 16px 8px;
    border-bottom: 1px solid #222222;
    color: #cccccc;
    vertical-align: top;
    line-height: 1.4;
}

.pos-search__cell strong {
    color: #ffffff;
}

.pos-search__row-result:last-child .pos-search__cell {
    border-bottom: none;
}

.pos-search__id {
    font-weight: 700;
    color: #aaaaaa;
    font-size: 14px;
    white-space: nowrap;
}

.pos-search__meta {
    font-size: 12px;
    color: var(--mf-color-brand);
}

/* Badges (Neon style for dark theme) */
.pos-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 6px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.pos-badge--active {
    background-color: rgba(22, 163, 74, 0.15);
    color: #4ade80;
    border: 1px solid rgba(74, 222, 128, 0.3);
}

.pos-badge--cancelled {
    background-color: rgba(220, 38, 38, 0.15);
    color: #f87171;
    border: 1px solid rgba(248, 113, 113, 0.3);
}

.pos-badge--expired {
    background-color: rgba(255, 255, 255, 0.08);
    color: #888888;
    border: 1px solid rgba(255, 255, 255, 0.15);
}

/* Messaging */
.pos-search__msg {
    padding: 24px 8px;
    color: #888888;
    font-style: italic;
    text-align: center;
}

.pos-search__msg--error {
    color: #f87171;
    font-weight: 600;
}

.pos-search__past-toggle-row td {
    padding: 8px 0;
    border-top: 1px solid var(--mf-color-border, #333);
}

.pos-search__past-toggle-btn {
    background: none;
    border: none;
    color: #888888;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5em;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    padding: 0;
    width: 100%;
    text-align: left;
}

.pos-search__past-toggle-btn:hover {
    color: #cccccc;
}

.pos-search__past-toggle-row td {
    padding: 12px 8px;
    border-bottom: 2px solid #333333;
    border-top: 2px solid #333333;
}



.pos-search__count {
    margin-top: 16px;
    font-size: 13px;
    color: #666666;
    text-align: right;
    font-weight: 500;
}

.pos-badge--warning {
    background-color: rgba(245, 158, 11, 0.15);
    color: #fbbf24;
    border: 1px solid rgba(251, 191, 36, 0.3);
}

/* New Info Badge (Im Park) */
.pos-badge--info {
    background-color: rgba(59, 130, 246, 0.15);
    color: #60a5fa;
    border: 1px solid rgba(96, 165, 250, 0.3);
}

.pos-search__today-badge {
    display: inline-block;
    background-color: rgba(22, 163, 74, 0.15);
    color: #4ade80;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 2px 6px;
    border-radius: 4px;
    vertical-align: middle;
}

/* =======================================================
   Live Clock Shortcode
   ======================================================= */

.mt-live-clock {
    display: inline-flex;
    align-items: center;
}

.mt-live-clock__text {
    /* Monospace font so digits do not jump when seconds change */
    font-weight: 700;
    color: var(--mf-color-brand);
    font-size: 50px;
    line-height: 1em;
    letter-spacing: 0.05em;
    font-variant-numeric: tabular-nums; /* Equal-width digits */
    text-shadow: 0 0 10px rgba(74, 222, 128, 0.2);
}