/* ═══════════════════════════════════════
   chatbot-modals.css — RTS Ferries
═══════════════════════════════════════ */

#table-modal { position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999; }
.table-overlay { position:absolute; width:100%; height:100%; background:rgba(15,23,42,.45); }
.table-container {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:80%; max-height:80%; background:#fff; border-radius:12px;
  border:1px solid var(--grey-light);
  padding:18px; overflow:auto; box-shadow:0 12px 40px rgba(11,37,69,.18);
  animation: modalIn .15s ease-out;
}
.table-content table { width:100%; border-collapse:collapse; }
.table-content th,
.table-content td    { padding:8px; border:1px solid var(--grey-light); text-align:left; }
.table-content th    { background:var(--off-white); font-weight:600; }
.table-close {
  position:absolute; top:10px; right:12px;
  border:1px solid var(--grey-light); background:#fff; color:var(--text);
  font-size:14px; cursor:pointer; padding:5px 11px; border-radius:8px;
  transition:background .15s;
}
.table-close:hover { background:var(--off-white); }
.table-wrapper     { position:relative; margin-top:6px; }
.table-expand-btn  {
  position:absolute; top:-10px; right:0;
  background:var(--navy); color:#fff; border:none;
  font-size:12px; padding:5px 9px; border-radius:7px; cursor:pointer;
  transition:opacity .15s;
}
.table-expand-btn:hover { opacity:.88; }

#feedback-modal {
  position:fixed; top:0; left:0; width:100%; height:100%; z-index:10000;
  display:flex; align-items:center; justify-content:center;
}
.fb-overlay { position:absolute; width:100%; height:100%; background:rgba(15,23,42,.4); }
.fb-box {
  position:relative; background:#fff; border-radius:14px;
  border:1px solid var(--grey-light);
  padding:24px; width:320px; box-shadow:0 12px 40px rgba(11,37,69,.18);
  z-index:1; animation:modalIn .18s ease-out;
}
@keyframes modalIn { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:translateY(0)} }
.fb-box h3 { font-size:15px; font-weight:700; color:var(--text); margin:0 0 4px; }
.fb-box p  { font-size:12px; color:var(--grey-text); margin:0 0 14px; }

.fb-emoji-row { display:flex; justify-content:center; gap:8px; margin-bottom:14px; }
.fb-emoji {
  font-size:20px; cursor:pointer; padding:7px 11px;
  border-radius:10px; border:1px solid var(--grey-light);
  transition:all .15s; background:#fff;
}
.fb-emoji:hover,
.fb-emoji.fb-em-active { background:var(--off-white); border-color:var(--navy); }

.fb-textarea {
  width:100%; border:1px solid var(--grey-light); border-radius:8px;
  padding:10px 13px; font-size:12px; font-family:var(--font-body);
  resize:none; outline:none; color:var(--text); transition:border-color .15s; box-sizing:border-box;
}
.fb-textarea:focus { border-color:var(--navy); }

.fb-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:12px; }
.fb-cancel {
  background:#fff; border:1px solid var(--grey-light); color:var(--grey-text); padding:8px 17px;
  border-radius:8px; font-size:12px; cursor:pointer; font-weight:600; transition:background .15s;
}
.fb-cancel:hover { background:var(--off-white); }
.fb-submit {
  background:var(--navy); border:none; color:#fff; padding:8px 19px;
  border-radius:8px; font-size:12px; font-weight:600; cursor:pointer;
  transition:opacity .15s;
}
.fb-submit:hover { opacity:.88; }

.fb-close { position:absolute; top:12px; right:14px; background:none; border:none; font-size:16px; cursor:pointer; color:var(--grey-text); transition:color .15s; }
.fb-close:hover { color:var(--text); }

.fb-thankyou { text-align:center; padding:10px 0 4px; }
.fb-thankyou .fb-ty-icon { font-size:34px; margin-bottom:8px; }
.fb-thankyou h3 { font-size:15px; font-weight:700; color:var(--text); margin:0 0 4px; }
.fb-thankyou p  { font-size:12px; color:var(--grey-text); margin:0; }