/* restaurant_floor.css — extracted from restaurant_floor.html (Phase 1).
   Pure CSS only; the first <style> block (waiter_mode conditionals +
   {% trans %}) stays inline in the template. Stamped ?v=STATIC_VERSION. */

    /* Manage Tables — iOS: segmented tabs, blue accents, white cards on the grey sheet */
    #tableManagerModal .tm-tabs {
        display: flex; gap: 2px; padding: 2px; margin: 0 16px 8px;
        background: #e3e3e8; border-radius: 9px; flex-shrink: 0;
    }
    #tableManagerModal .tm-tab {
        flex: 1 1 0; background: transparent; border: 0; border-radius: 7px;
        padding: 7px 6px; font-size: 0.86rem; font-weight: 500;
        color: #000; cursor: pointer;
    }
    #tableManagerModal .tm-tab.is-active {
        background: #fff; font-weight: 600;
        box-shadow: 0 3px 8px rgba(0,0,0,0.12), 0 0 1px rgba(0,0,0,0.08);
    }
    #tableManagerModal .table-responsive { background: #fff; border-radius: 10px; }
    #tableManagerModal .tm-tab-panel { display: none; }
    #tableManagerModal .tm-tab-panel.is-active { display: block; }
    #tableManagerModal .tm-bulk-bar {
        display: none; align-items: center; gap: 0.5rem;
        background: rgba(0,122,255,0.1); border: 1px solid #007aff;
        padding: 0.55rem 0.85rem; border-radius: 999px;
        margin-bottom: 0.65rem;
        font-size: 0.82rem;
    }
    #tableManagerModal .tm-bulk-bar.is-visible { display: flex; }
    #tableManagerModal .tm-bulk-bar .count {
        font-weight: 700; color: #0062cc;
    }
    #tableManagerModal .tm-bulk-bar select,
    #tableManagerModal .tm-bulk-bar input {
        padding: 0.3rem 0.55rem; border: 1px solid #e5e5ea;
        border-radius: 8px; font-size: 0.82rem; background: white;
    }
    #tableManagerModal .tm-bulk-bar .btn-bulk {
        background: white; border: 1px solid #e5e5ea;
        padding: 0.3rem 0.75rem; border-radius: 8px;
        font-size: 0.78rem; font-weight: 500; cursor: pointer;
    }
    #tableManagerModal .tm-bulk-bar .btn-bulk:hover {
        border-color: #007aff; color: #0062cc;
    }
    #tableManagerModal .tm-bulk-bar .btn-bulk.danger:hover {
        border-color: #b91c1c; color: #b91c1c; background: #fef2f2;
    }
    #tableManagerModal .tm-hours-cell { position: relative; min-width: 110px; }
    #tableManagerModal .tm-hours-select {
        width: 100%; padding: 0.3rem 0.5rem;
        border: 1px solid #e5e5ea; border-radius: 7px;
        font-size: 0.78rem; background: white;
    }
    #tableManagerModal .tm-hours-select.is-override {
        border-color: #007aff; background: rgba(0,122,255,0.1); color: #0062cc;
        font-weight: 600;
    }
    #tableManagerModal .tm-custom-row {
        background: #fff; border-top: 1px dashed #e5e5ea;
    }
    #tableManagerModal .tm-custom-grid {
        display: grid; grid-template-columns: repeat(7, 1fr);
        gap: 6px; padding: 0.6rem 0.85rem;
    }
    #tableManagerModal .tm-custom-day {
        background: white; border: 1px solid #e5e5ea;
        border-radius: 8px; padding: 0.4rem 0.45rem;
        font-size: 0.7rem;
    }
    #tableManagerModal .tm-custom-day .dow {
        font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em;
        color: #6d6d72; font-size: 0.62rem; margin-bottom: 0.25rem;
    }
    #tableManagerModal .tm-custom-day input[type="time"] {
        width: 100%; padding: 0.18rem 0.3rem;
        border: 1px solid #e5e5ea; border-radius: 5px;
        font-size: 0.72rem; background: white;
        margin-bottom: 2px;
    }
    #tableManagerModal .tm-custom-day .closed-toggle {
        font-size: 0.62rem; color: #007aff;
        display: flex; align-items: center; gap: 3px;
    }
    #tableManagerModal .tm-custom-actions {
        display: flex; justify-content: flex-end; gap: 0.4rem;
        padding: 0 0.85rem 0.6rem;
    }
    /* Batch add form */
    #tableManagerModal .tm-batch-form {
        display: grid; grid-template-columns: 1fr 1fr 1fr;
        gap: 0.85rem;
    }
    #tableManagerModal .tm-batch-form label {
        display: block; font-size: 0.7rem; font-weight: 700;
        color: #6d6d72; text-transform: uppercase; letter-spacing: 0.06em;
        margin-bottom: 0.25rem;
    }
    #tableManagerModal .tm-batch-form input,
    #tableManagerModal .tm-batch-form select {
        width: 100%; padding: 0.55rem 0.75rem;
        border: 1.5px solid #e5e5ea; border-radius: 10px;
        font-size: 0.92rem; background: white;
    }
    #tableManagerModal .tm-batch-form input:focus,
    #tableManagerModal .tm-batch-form select:focus {
        outline: none; border-color: #007aff;
        box-shadow: 0 0 0 3px rgba(0,122,255,0.2);
    }
    #tableManagerModal .tm-batch-preview {
        margin-top: 0.85rem; padding: 0.7rem 1rem;
        background: #fff; border-radius: 12px;
        font-size: 0.82rem; color: #6d6d72;
    }
    #tableManagerModal .tm-batch-preview strong { color: #0062cc; }
    #tableManagerModal .btn-batch-create {
        background: #007aff; color: white; border: 0;
        padding: 0.65rem 1.5rem; border-radius: 999px;
        font-weight: 600; cursor: pointer; font-size: 0.92rem;
        box-shadow: 0 6px 16px -6px rgba(0,122,255,0.4);
    }
    #tableManagerModal .btn-batch-create:hover { background: #0062cc; }

  #aiWaiterBtn {
    position: fixed; bottom: 84px; right: 16px; z-index: 1040;
    width: 56px; height: 56px; border-radius: 50%; border: none;
    background: linear-gradient(135deg, #6f42c1, #d63384);
    color: #fff; box-shadow: 0 6px 20px rgba(111, 66, 193, 0.4);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem; cursor: pointer; transition: transform .2s;
  }
  #aiWaiterBtn:active { transform: scale(0.94); }
  #aiWaiterSheet {
    /* z-index must beat the waiter bottom-nav (9999) so the input bar
       isn't clipped underneath it. Backdrop sits just under the sheet. */
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 10100;
    background: #fff; border-top-left-radius: 18px; border-top-right-radius: 18px;
    box-shadow: 0 -8px 30px rgba(0,0,0,0.18);
    max-height: 80vh; min-height: 50vh; display: none;
    flex-direction: column;
    padding-bottom: calc(env(safe-area-inset-bottom, 0) + 8px);
  }
  /* In waiter mode, lift the sheet above the bottom nav (56px) so the
     waiter can still see + tap the nav while the AI is open. */
  body.waiter-body #aiWaiterSheet { bottom: 56px; }
  #aiWaiterSheet.open { display: flex; }
  #aiWaiterBackdrop { position: fixed; inset: 0; z-index: 10099;
    background: rgba(0,0,0,0.4); display: none; }
  #aiWaiterBackdrop.open { display: block; }
  #aiWaiterHeader {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 0.75rem 1rem; border-bottom: 1px solid #e9ecef;
  }
  #aiWaiterHeader h6 { margin: 0; font-weight: 700; flex: 1; }
  .ai-icon-btn.recording {
    background: #dc3545 !important; color: #fff !important;
    animation: aiPulse 1s ease-in-out infinite;
  }
  @keyframes aiPulse { 0%, 100% { transform: scale(1) } 50% { transform: scale(1.08) } }
  #aiWaiterLog {
    flex: 1; overflow-y: auto; padding: 0.75rem; background: #f8f9fa;
  }
  .ai-bubble { padding: 0.6rem 0.85rem; border-radius: 14px;
    margin-bottom: 0.5rem; max-width: 85%; font-size: 0.92rem;
    line-height: 1.4; word-wrap: break-word; white-space: pre-wrap; }
  .ai-bubble.user { background: #6f42c1; color: #fff; margin-left: auto;
    border-bottom-right-radius: 4px; }
  .ai-bubble.bot  { background: #fff; color: #212529; border: 1px solid #e9ecef;
    margin-right: auto; border-bottom-left-radius: 4px; }
  .ai-bubble.sys  { background: rgba(108,117,125,0.08); color: #6c757d;
    font-size: 0.78rem; font-style: italic; margin: 0 auto 0.5rem; text-align: center; }
  #aiWaiterInputBar {
    display: flex; gap: 0.4rem; padding: 0.6rem 0.75rem; border-top: 1px solid #e9ecef;
    background: #fff;
  }
  #aiWaiterInput {
    flex: 1; border: 1px solid #ced4da; border-radius: 20px;
    padding: 0.5rem 0.85rem; font-size: 0.95rem; outline: none;
  }
  #aiWaiterInput:focus { border-color: #6f42c1; box-shadow: 0 0 0 .15rem rgba(111,66,193,0.18); }
  .ai-icon-btn {
    width: 42px; height: 42px; border-radius: 50%; border: none;
    background: #f1f3f5; color: #495057; display: flex; align-items: center;
    justify-content: center; font-size: 1.1rem; cursor: pointer; flex-shrink: 0;
  }
  .ai-icon-btn.primary { background: #6f42c1; color: #fff; }
  .ai-icon-btn:disabled { opacity: 0.5; cursor: not-allowed; }
  .ai-typing-dot {
    display: inline-block; width: 6px; height: 6px; border-radius: 50%;
    background: #adb5bd; margin: 0 2px; animation: aiBlink 1.4s infinite both;
  }
  .ai-typing-dot:nth-child(2) { animation-delay: 0.2s; }
  .ai-typing-dot:nth-child(3) { animation-delay: 0.4s; }
  @keyframes aiBlink { 0%, 80%, 100% { opacity: 0.3 } 40% { opacity: 1 } }