/* Restaurant Order System — Admin CSS */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

.ros-admin-wrap { max-width: 1100px; padding: 20px; font-family: 'Inter', sans-serif; }
.ros-admin-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
.ros-admin-header h1 { font-size: 1.6rem; font-weight: 700; margin: 0; }

.ros-stat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; margin-bottom: 30px; }
.ros-stat-card { background: #fff; border-radius: 12px; padding: 24px; text-align: center; box-shadow: 0 2px 12px rgba(0,0,0,0.06); border-top: 4px solid #ccc; }
.ros-stat-green  { border-top-color: #2ECC71; }
.ros-stat-blue   { border-top-color: #3498DB; }
.ros-stat-gold   { border-top-color: #C9A96E; }
.ros-stat-purple { border-top-color: #9B59B6; }
.ros-stat-icon  { font-size: 2rem; margin-bottom: 8px; }
.ros-stat-number { font-size: 1.8rem; font-weight: 800; color: #1A1A1A; margin-bottom: 4px; }
.ros-stat-label  { font-size: 0.82rem; color: #888; font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; }

.ros-form-card { background: #fff; border-radius: 12px; padding: 24px; margin-bottom: 24px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); }
.ros-form-card h2 { margin-bottom: 20px; font-size: 1.1rem; color: #333; }
.ros-field { margin-bottom: 16px; }
.ros-field label { display: block; font-size: 0.85rem; font-weight: 600; color: #555; margin-bottom: 6px; }
.ros-field input[type=text],
.ros-field input[type=number],
.ros-field textarea,
.ros-field select {
  width: 100%; padding: 10px 14px;
  border: 1.5px solid #e0e0e0; border-radius: 8px;
  font-family: 'Inter', sans-serif; font-size: 0.9rem;
  transition: border-color 0.2s;
}
.ros-field input:focus, .ros-field textarea:focus, .ros-field select:focus {
  outline: none; border-color: #C9A96E;
}
.ros-form-inline { display: flex; gap: 12px; align-items: flex-end; margin-bottom: 24px; flex-wrap: wrap; }
.ros-field-inline label { display: block; font-size: 0.82rem; font-weight: 600; color: #555; margin-bottom: 4px; }
.ros-field-inline input { padding: 9px 12px; border: 1.5px solid #ddd; border-radius: 8px; font-size: 0.9rem; }

.ros-btn { display: inline-block; padding: 10px 22px; border-radius: 50px; font-size: 0.88rem; font-weight: 600; cursor: pointer; border: none; text-decoration: none; transition: all 0.2s; }
.ros-btn-primary { background: linear-gradient(135deg, #C9A96E, #B8913A); color: #1A1A1A; }
.ros-btn-primary:hover { opacity: 0.9; }
.ros-btn-secondary { background: #f0f0f0; color: #333; margin-left: 8px; }
.ros-btn-danger-sm { background: #E74C3C !important; color: #fff !important; }

.ros-table { border-radius: 12px; overflow: hidden; }
.ros-table thead th { background: #1A1A1A; color: #fff; padding: 12px 14px; font-size: 0.85rem; font-weight: 600; }
.ros-table tbody tr:hover { background: #fafafa; }
.ros-table td { padding: 10px 14px; vertical-align: middle; font-size: 0.9rem; border-bottom: 1px solid #f0f0f0; }

.ros-status-pill { display: inline-block; padding: 3px 10px; border-radius: 20px; font-size: 0.78rem; font-weight: 700; text-transform: capitalize; }
.ros-status-free     { background: #d5f5e3; color: #1e8449; }
.ros-status-occupied { background: #fde8d8; color: #a04000; }
.ros-status-pending  { background: #fef9e7; color: #b7950b; }
.ros-status-accepted { background: #d6eaf8; color: #1a5276; }
.ros-status-preparing{ background: #fde8d8; color: #a04000; }
.ros-status-ready    { background: #d5f5e3; color: #1e8449; }
.ros-status-closed   { background: #f0f0f0; color: #888; }

.ros-cat-admin-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.ros-cat-admin-tab { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 50px; background: #f0f0f0; color: #555; text-decoration: none; font-size: 0.88rem; font-weight: 500; transition: all 0.2s; }
.ros-cat-admin-tab.active { background: #1A1A1A; color: #C9A96E; }
.ros-cat-actions a { color: inherit; opacity: 0.5; text-decoration: none; font-size: 0.8rem; }
.ros-cat-actions a:hover { opacity: 1; }

.ros-shortcut-grid { display: flex; flex-wrap: wrap; gap: 12px; }
.ros-shortcut { display: inline-block; background: #1A1A1A; color: #C9A96E; text-decoration: none; padding: 12px 20px; border-radius: 10px; font-weight: 600; font-size: 0.9rem; transition: opacity 0.2s; }
.ros-shortcut:hover { opacity: 0.8; color: #C9A96E; }
.ros-admin-shortcuts, .ros-admin-info { background: #fff; border-radius: 12px; padding: 24px; margin-bottom: 24px; box-shadow: 0 2px 12px rgba(0,0,0,0.06); }
.ros-admin-shortcuts h2, .ros-admin-info h2 { margin-bottom: 16px; font-size: 1.05rem; }
.ros-admin-info code { background: #f5f5f5; padding: 3px 8px; border-radius: 4px; font-size: 0.85rem; }
.ros-empty { color: #888; padding: 20px 0; }
