/* Default: desktop/laptop wide layout */
.hive-table {
    width: 100%;
    table-layout: auto;
    font-size: 16px;
}

.hive-table th,
.hive-table td {
    padding: 10px 12px;
    white-space: nowrap;
}

/* Mobile: compact layout */
@media (max-width: 800px) {
    .hive-table {
        font-size: 14px;
        table-layout: fixed;
    }

    .hive-table th,
    .hive-table td {
        padding: 6px 8px;
        white-space: normal;
    }
}

/* ⭐ CRITICAL: Break out of Elementor’s narrow column */
.elementor .elementor-widget-container,
.elementor .elementor-widget-container > .elementor-text-editor {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Full-width timeline on desktop */
#timeline {
    width: 100% !important;
    max-width: 1600px;
    min-height: 600px;
    margin: 0 auto;
    overflow-x: auto;
}

/* Side-by-side buttons */
.timeline-buttons {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin: 20px 0;
}

.timeline-buttons button {
    min-width: 180px;
}

/* Mobile layout */
@media (max-width: 800px) {
    #timeline,
    .hive-reports-wrapper .hive-card,
    .hive-actions-wrapper .hive-card,
    .hive-queen-wrapper .hive-card {
        max-width: 95%;
        margin: 10px auto;
        padding: 10px;
    }

    .timeline-buttons {
        flex-direction: column;
        gap: 10px;
    }
}

/* Only widen cards inside reports pages */
.hive-reports-wrapper .hive-card,
.hive-actions-wrapper .hive-card,
.hive-queen-wrapper .hive-card {
    max-width: 1600px;
    width: 100%;
    margin: 20px auto;
    padding: 20px;
}

body #timeline {
    width: 100% !important;
    max-width: 1600px !important;
    min-height: 600px;
    margin: 0 auto !important;
    overflow-x: auto;
}

/* Shared button styling */
.hive-button,
.hive-cancel-button,
.timeline-buttons button,
.hive-card form button {
    min-width: 180px;          /* consistent minimum width */
    max-width: 240px;          /* prevents huge buttons */
    width: auto;               /* no full-width stretching */
    padding: 12px 20px;
    font-size: 16px;
    border-radius: 8px;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    margin: 0;
}

/* Ensure buttons inside forms don't stretch full width */
.hive-card form {
    text-align: center;
}

/* Mobile: stack buttons neatly */
@media (max-width: 800px) {
    .timeline-buttons {
        flex-direction: column;
    }
}

.timeline-buttons form {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.timeline-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;      /* ← nice small gap */
    margin: 20px 0;
}

.timeline-buttons button {
    width: 200px;   /* or 160px if you prefer */
}

/* ------------------------------ */
/* Queen selection card layout    */
/* ------------------------------ */

/* Card wrapper for queen selection */
.hive-card.queen-card {
    background: #ffffff;
    padding: 25px 30px;
    border-radius: 12px;
    max-width: 600px;
    margin: 20px auto;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    text-align: center;
}

/* Title */
.hive-card.queen-card h2 {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 26px;
}

/* Form layout */
.queen-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Label */
.queen-label {
    font-size: 18px;
    margin-bottom: 5px;
    display: block;
}

/* Dropdown */
.queen-select {
    width: 100%;
    padding: 12px;
    font-size: 18px;
    border: 1px solid #ccc;
    border-radius: 6px;
}

/* Button container */
.queen-buttons {
    display: flex;
    justify-content: center;
}

/* Buttons (reuse your existing button styles) */
.queen-buttons .hive-button,
.queen-buttons .hive-cancel-button {
    min-width: 180px;
    max-width: 220px;
    padding: 12px 20px;
    font-size: 18px;
    border-radius: 8px;
    cursor: pointer;
}

/* Primary button */
.queen-buttons .hive-button {
    background: #0073aa;
    color: white;
    border: none;
}

.queen-buttons .hive-button:hover {
    background: #005f8d;
}

/* Cancel button */
.queen-buttons .hive-cancel-button {
    background: #ccc;
    border: none;
}

.queen-buttons .hive-cancel-button:hover {
    background: #bbb;
}

/* Mobile adjustments */
@media (max-width: 600px) {
    .hive-card.queen-card {
        padding: 20px;
    }
    .queen-buttons .hive-button,
    .queen-buttons .hive-cancel-button {
        width: 100%;
        max-width: none;
    }
}

/* Default hive-card (used by login, OTP, etc.) */
.hive-card {
    background: #ffffff;
    padding: 25px 30px;
    border-radius: 12px;
    max-width: 420px;      /* ← original narrow width restored */
    margin: 20px auto;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    text-align: center;
}

/* Lineage of Queens page — wide layout */
.hive-lineage-wrapper .hive-card {
    max-width: 1600px;
    width: 100%;
    margin: 20px auto;
    padding: 20px;
}

/* Mobile */
@media (max-width: 800px) {
    .hive-lineage-wrapper .hive-card {
        max-width: 95%;
        margin: 10px auto;
        padding: 10px;
    }
}

/* Lineage pages full width */
.hive-lineage-wrapper {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Report pages full width */
.hive-report-wrapper {
    width: 100% !important;
    max-width: 100% !important;
}

/* Break out of Elementor's fixed-width container */
body .elementor-container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
}

/* Override WordPress global content width for Hive Records pages */
body .wp-site-blocks {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Make hive-cards full-width inside reports */
.hive-report-wrapper .hive-card {
    max-width: 100% !important;
    width: 100% !important;
    margin: 20px 0 !important;
    padding: 20px !important;
}

/* Put report buttons on the same line */
.hive-report-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin: 20px 0;
}

.hive-report-buttons form {
    margin: 0;
    padding: 0;
}

.hive-report-buttons button {
    min-width: 180px;
}

/* Mobile: stack buttons */
@media (max-width: 700px) {
    .hive-report-buttons {
        flex-direction: column;
        gap: 10px;
    }
}

/* ============================================
   ADD / EDIT FORMS (Apiary, Hive, Queen)
   ============================================ */

.hive-report-wrapper {
    max-width: 700px;
    margin: 0 auto;
    padding: 20px;
}

.hive-report-wrapper .hive-card {
    background: #ffffff;
    padding: 25px 30px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    margin: 20px auto;
}

.hive-report-wrapper .hive-card h2 {
    margin-top: 0;
    margin-bottom: 20px;
    text-align: center;
    font-size: 26px;
}

/* Form fields */
.hive-report-wrapper input[type="text"],
.hive-report-wrapper input[type="number"],
.hive-report-wrapper input[type="date"],
.hive-report-wrapper input[type="file"],
.hive-report-wrapper select,
.hive-report-wrapper textarea {
    width: 100%;
    padding: 12px;
    margin-bottom: 16px;
    border-radius: 6px;
    border: 1px solid #ccc;
    font-size: 16px;
    box-sizing: border-box;
}

/* Primary submit button */
.hive-report-wrapper button[type="submit"] {
    width: 100%;
    padding: 14px;
    background: #2b6cb0;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 18px;
    cursor: pointer;
    margin-top: 10px;
}

.hive-report-wrapper button[type="submit"]:hover {
    background: #1e4f82;
}

/* Cancel button (already partly styled) */
.hive-report-wrapper .hive-cancel-button {
    width: 100%;
    padding: 14px;
    background: #e0e0e0;
    color: #333;
    border: none;
    border-radius: 8px;
    font-size: 18px;
    cursor: pointer;
    margin-top: 10px;
}

.hive-report-wrapper .hive-cancel-button:hover {
    background: #c8c8c8;
}

/* ============================================
   ADD / EDIT FORMS (Apiary, Hive, Queen)
   ============================================ */

.hive-report-wrapper {
    max-width: 700px !important;
    margin: 0 auto !important;
    padding: 20px;
}

.hive-report-wrapper .hive-card {
    max-width: 700px !important;
    width: 100% !important;
    margin: 20px auto !important;
    padding: 25px 30px !important;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}