/* TravelNet Route – Admin + Frontend Styles */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');

/* ── ADMIN WRAP ── */
.tnr-wrap { font-family:'DM Sans',sans-serif; max-width:1400px; }

.tnr-header { display:flex; align-items:center; justify-content:space-between; padding:20px 0 16px; border-bottom:2px solid #0b2545; margin-bottom:24px; }
.tnr-header-left { display:flex; align-items:center; gap:12px; }
.tnr-icon { font-size:28px; }
.tnr-header h1 { margin:0; font-size:24px; font-weight:700; color:#0b2545; }

/* Buttons */
.tnr-btn { display:inline-flex; align-items:center; gap:6px; padding:9px 18px; border-radius:6px; font-size:13px; font-weight:600; cursor:pointer; text-decoration:none; border:2px solid transparent; transition:all .15s; }
.tnr-btn-primary   { background:#0b2545; color:#fff; border-color:#0b2545; }
.tnr-btn-primary:hover { background:#1a3f70; border-color:#1a3f70; color:#fff; }
.tnr-btn-ghost { background:transparent; color:#555; border-color:#ddd; }
.tnr-btn-ghost:hover { border-color:#999; color:#333; }
.tnr-btn-large { padding:12px 28px; font-size:15px; }
button.tnr-btn { font-family:'DM Sans',sans-serif; }

/* Notices */
.tnr-notice { padding:12px 18px; border-radius:6px; margin-bottom:16px; font-weight:500; }
.tnr-notice-success { background:#d4edda; color:#155724; border-left:4px solid #28a745; }
.tnr-notice-warning { background:#fff3cd; color:#856404; border-left:4px solid #ffc107; }
.tnr-notice-error   { background:#f8d7da; color:#721c24; border-left:4px solid #dc3545; }

/* Search */
.tnr-search-bar { display:flex; align-items:center; gap:8px; margin-bottom:16px; flex-wrap:wrap; }
.tnr-search-bar input { padding:8px 12px; border:2px solid #ddd; border-radius:6px; font-size:13px; font-family:'DM Sans',sans-serif; }
.tnr-search-bar input:focus { border-color:#0b2545; outline:none; }
.tnr-count { margin-left:auto; color:#888; font-size:13px; }

/* Admin table */
.tnr-table { width:100%; border-collapse:collapse; background:#fff; border-radius:8px; overflow:hidden; box-shadow:0 1px 4px rgba(0,0,0,.08); }
.tnr-table thead tr { background:#0b2545; color:#fff; }
.tnr-table th { padding:12px 14px; font-size:12px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; text-align:left; }
.tnr-table td { padding:11px 14px; border-bottom:1px solid #f0f0f0; vertical-align:middle; font-size:13px; }
.tnr-table tbody tr:hover td { background:#f5faff; }
.tnr-table tbody tr:last-child td { border-bottom:none; }

.tnr-cell-airline { display:flex; align-items:center; gap:8px; }
.tnr-logo-thumb { width:44px; height:26px; object-fit:contain; border:1px solid #eee; border-radius:4px; padding:2px; flex-shrink:0; }
.tnr-badge { display:inline-block; padding:2px 8px; background:#e8f0fe; color:#1a5dbf; border-radius:4px; font-size:12px; font-weight:700; letter-spacing:.04em; }
.tnr-cell-route { min-width:200px; }
.tnr-route-line { display:flex; align-items:center; gap:6px; margin-bottom:3px; }
.tnr-ap-code { font-size:15px; font-weight:700; color:#0b2545; }
.tnr-arrow { color:#aaa; font-size:16px; }
.tnr-route-cities { font-size:11px; color:#888; }
.tnr-status { display:inline-block; padding:3px 9px; border-radius:20px; font-size:11px; font-weight:600; }
.tnr-status-active   { background:#d4edda; color:#155724; }
.tnr-status-inactive { background:#e2e3e5; color:#6c757d; }
.tnr-sc-preview { font-size:11px; background:#f5f5f5; padding:3px 7px; border-radius:4px; }
.tnr-empty { text-align:center; padding:40px; color:#888; font-size:14px; }
.tnr-actions { white-space:nowrap; }
.tnr-action-btn { display:inline-block; padding:4px 10px; border-radius:4px; font-size:12px; font-weight:600; text-decoration:none; margin-right:4px; }
.tnr-action-edit   { background:#e8f0fe; color:#1a5dbf; }
.tnr-action-edit:hover { background:#d0e1ff; }
.tnr-action-delete { background:#fde8e8; color:#c0392b; }
.tnr-action-delete:hover { background:#fcd4d4; }

/* FORM */
.tnr-form-grid { display:grid; grid-template-columns:1fr 420px; gap:24px; margin-bottom:24px; }
.tnr-form-section { background:#fff; border-radius:8px; padding:24px; box-shadow:0 1px 4px rgba(0,0,0,.08); }
.tnr-form-section h2 { font-size:16px; font-weight:700; color:#0b2545; margin:0 0 20px; padding-bottom:12px; border-bottom:2px solid #f0f0f0; }
.tnr-field { margin-bottom:16px; }
.tnr-field label { display:block; font-size:13px; font-weight:600; color:#333; margin-bottom:6px; }
.tnr-field input[type="text"],
.tnr-field input[type="url"],
.tnr-field input[type="number"],
.tnr-field select,
.tnr-field textarea { width:100%; padding:9px 12px; border:2px solid #ddd; border-radius:6px; font-size:13px; font-family:'DM Sans',sans-serif; color:#333; box-sizing:border-box; transition:border-color .15s; }
.tnr-field input:focus, .tnr-field select:focus, .tnr-field textarea:focus { border-color:#0b2545; outline:none; box-shadow:0 0 0 3px rgba(11,37,69,.07); }
.tnr-field .required { color:#c0392b; }
.tnr-hint { font-size:11px; color:#888; margin:4px 0 0; }
.tnr-field-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.tnr-form-footer { display:flex; align-items:center; gap:12px; padding:20px 0; border-top:2px solid #f0f0f0; }

/* PICKER (airline / airport autocomplete) */
.tnr-picker-wrap { position:relative; }
.tnr-picker-search { display:flex; gap:8px; }
.tnr-picker-input { flex:1; }
.tnr-picker-dropdown {
    position:absolute;
    top:100%; left:0; right:0;
    background:#fff;
    border:2px solid #0b2545;
    border-top:none;
    border-radius:0 0 8px 8px;
    max-height:240px;
    overflow-y:auto;
    z-index:1000;
    display:none;
    box-shadow:0 8px 20px rgba(0,0,0,.12);
}
.tnr-picker-dropdown.open { display:block; }
.tnr-picker-option {
    display:flex;
    align-items:center;
    gap:10px;
    padding:9px 12px;
    cursor:pointer;
    transition:background .1s;
    font-size:13px;
}
.tnr-picker-option:hover { background:#f0f5ff; }
.tnr-picker-option img { width:36px; height:22px; object-fit:contain; border:1px solid #eee; border-radius:3px; padding:1px; flex-shrink:0; }
.tnr-picker-option-no-logo { width:36px; height:22px; background:#f5f5f5; border-radius:3px; display:flex; align-items:center; justify-content:center; font-size:14px; flex-shrink:0; }
.tnr-picker-option-name { font-weight:600; color:#0b2545; }
.tnr-picker-option-meta { font-size:11px; color:#888; }
.tnr-picker-option-code { margin-left:auto; font-size:12px; font-weight:700; background:#e8f0fe; color:#1a5dbf; padding:2px 6px; border-radius:4px; }

.tnr-picker-selected {
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:8px;
    padding:8px 12px;
    background:#f0f5ff;
    border:2px solid #c5d5f5;
    border-radius:6px;
    font-size:13px;
    min-height:38px;
}
.tnr-picker-selected:empty { display:none; }
.tnr-picker-selected img { height:24px; max-width:44px; object-fit:contain; }
.tnr-picker-selected span { font-weight:600; flex:1; }
.tnr-picker-selected code { background:#e8f0fe; color:#1a5dbf; padding:2px 6px; border-radius:4px; font-size:12px; }
.tnr-picker-clear { background:none; border:none; color:#c0392b; font-size:18px; cursor:pointer; padding:0 4px; line-height:1; }

/* Shortcode box */
.tnr-shortcode-box { background:#f5faff; border:2px solid #d0e8ff; border-radius:8px; padding:16px; margin-top:20px; }
.tnr-shortcode-box h3 { font-size:14px; font-weight:700; color:#0b2545; margin:0 0 12px; }
.tnr-sc-item { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; padding-bottom:8px; border-bottom:1px solid #e0edf8; }
.tnr-sc-item:last-child { border-bottom:none; margin-bottom:0; padding-bottom:0; }
.tnr-sc-label { font-size:11px; color:#666; display:block; margin-bottom:2px; }
.tnr-sc-item code { font-size:11px; background:#fff; padding:3px 7px; border-radius:4px; border:1px solid #dde; }
.tnr-copy-btn { padding:5px 10px; font-size:11px; font-weight:600; background:#0b2545; color:#fff; border:none; border-radius:4px; cursor:pointer; white-space:nowrap; font-family:'DM Sans',sans-serif; flex-shrink:0; }
.tnr-copy-btn:hover { background:#1a3f70; }
.tnr-copy-btn.copied { background:#28a745; }

/* Guide */
.tnr-guide { max-width:900px; }
.tnr-guide-section { background:#fff; border-radius:8px; padding:24px; box-shadow:0 1px 4px rgba(0,0,0,.08); margin-bottom:20px; }
.tnr-guide-section h2 { font-size:17px; font-weight:700; color:#0b2545; margin:0 0 14px; }
.tnr-code-block { background:#0b2545; color:#7dd3fc; padding:14px 18px; border-radius:6px; margin-bottom:10px; overflow-x:auto; }
.tnr-code-block code, .tnr-code-block pre { font-family:'Courier New',monospace; font-size:13px; color:#7dd3fc; margin:0; background:none; }

/* ─── FRONTEND ─── */

/* Route Card */
.tnr-route-card {
    display:flex;
    flex-direction:column;
    background:#fff;
    border:2px solid #e0ecf8;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 2px 10px rgba(11,37,69,.07);
    transition:box-shadow .2s, transform .2s;
    font-family:'DM Sans',sans-serif;
    text-decoration:none;
    color:inherit;
    max-width:420px;
}
.tnr-route-card:hover, .tnr-card-link:hover { box-shadow:0 6px 24px rgba(11,37,69,.14); transform:translateY(-2px); }
.tnr-card-head { display:flex; align-items:center; justify-content:space-between; padding:14px 18px 10px; border-bottom:1px solid #f0f0f0; }
.tnr-card-airline { display:flex; align-items:center; gap:8px; }
.tnr-card-airline img { max-height:28px; max-width:80px; object-fit:contain; }
.tnr-card-airline span { font-size:13px; font-weight:600; color:#0b2545; }
.tnr-flight-no { font-size:12px; font-weight:700; background:#e8f0fe; color:#1a5dbf; padding:3px 8px; border-radius:4px; }

.tnr-card-route { display:flex; align-items:center; justify-content:space-between; padding:20px 18px; gap:10px; }
.tnr-card-ap { display:flex; flex-direction:column; align-items:center; gap:4px; }
.tnr-big-code { font-size:28px; font-weight:800; color:#0b2545; letter-spacing:-.01em; }
.tnr-ap-city { font-size:12px; color:#666; text-align:center; }
.tnr-card-mid { flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; }
.tnr-dur-label, .tnr-dist-label { font-size:11px; color:#888; }
.tnr-dashed-line { width:100%; display:flex; align-items:center; position:relative; }
.tnr-dashed-line::before { content:''; flex:1; border-top:2px dashed #c5d5e8; }
.tnr-plane { font-size:18px; color:#1a5dbf; margin:0 6px; }
.tnr-dashed-line::after { content:''; flex:1; border-top:2px dashed #c5d5e8; }

.tnr-card-foot { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:12px 18px 14px; border-top:1px solid #f0f0f0; background:#fafcff; }
.tnr-price-tag { font-size:14px; font-weight:700; color:#0b2545; background:#e8f0fe; padding:4px 10px; border-radius:20px; }
.tnr-freq-tag  { font-size:12px; color:#555; background:#f5f5f5; padding:3px 8px; border-radius:20px; }
.tnr-cabin-tag { font-size:12px; color:#555; background:#f5f5f5; padding:3px 8px; border-radius:20px; }

/* Compact style */
.tnr-route-compact {
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 14px;
    background:#fff;
    border:2px solid #e0ecf8;
    border-radius:8px;
    font-family:'DM Sans',sans-serif;
    margin-bottom:8px;
}
.tnr-compact-airline img { max-height:24px; max-width:60px; object-fit:contain; }
.tnr-compact-route { flex:1; }
.tnr-city { font-weight:600; color:#0b2545; font-size:14px; }
.tnr-ap { font-size:12px; font-weight:700; color:#1a5dbf; background:#e8f0fe; padding:1px 5px; border-radius:3px; }
.tnr-arrow-lg { color:#aaa; font-size:16px; }
.tnr-compact-meta { display:flex; gap:10px; margin-top:4px; font-size:12px; color:#888; align-items:center; }
.tnr-compact-route a { text-decoration:none; color:inherit; }
.tnr-compact-route a:hover .tnr-city { color:#1a5dbf; }

/* Badge style */
.tnr-route-badge {
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 12px;
    background:#e8f0fe;
    border:1px solid #c5d5f5;
    border-radius:20px;
    text-decoration:none;
    font-family:'DM Sans',sans-serif;
    transition:background .15s;
}
a.tnr-route-badge:hover { background:#d0e1ff; }
.tnr-badge-code { font-size:13px; font-weight:800; color:#0b2545; }
.tnr-badge-arrow { color:#888; }
.tnr-badge-price { font-size:12px; font-weight:700; color:#1a5dbf; margin-left:4px; padding-left:6px; border-left:1px solid #c5d5f5; }

/* List wrap */
.tnr-route-list-wrap { font-family:'DM Sans',sans-serif; margin:1.5em 0; }
.tnr-list-heading { font-size:18px; font-weight:700; color:#0b2545; margin:0 0 16px; padding-bottom:10px; border-bottom:2px solid #e0ecf8; }
.tnr-route-items { display:flex; flex-direction:column; gap:10px; }
.tnr-route-items.tnr-cols-2 { display:grid; grid-template-columns:repeat(2,1fr); }
.tnr-route-items.tnr-cols-3 { display:grid; grid-template-columns:repeat(3,1fr); }

/* Table */
.tnr-table-wrap { overflow-x:auto; }
.tnr-route-table { width:100%; border-collapse:collapse; font-size:14px; font-family:'DM Sans',sans-serif; }
.tnr-route-table thead tr { background:#0b2545; color:#fff; }
.tnr-route-table th { padding:10px 14px; text-align:left; font-size:12px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; }
.tnr-route-table td { padding:10px 14px; border-bottom:1px solid #f0f0f0; vertical-align:middle; }
.tnr-route-table tbody tr:hover td { background:#f5faff; }
.tnr-route-table a { color:#1a5dbf; text-decoration:none; font-weight:600; }
.tnr-route-table a:hover { text-decoration:underline; }

/* ── TIME BADGES (admin list) ── */
.tnr-time-badge {
    display: inline-block;
    padding: 3px 8px;
    background: #e8f4fe;
    color: #0b6bbf;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: .02em;
}
.tnr-time-badge.tnr-time-arr {
    background: #e8fef0;
    color: #0b7a3e;
}

/* ── TIME DISPLAY ON FRONTEND CARD ── */
.tnr-ap-time {
    display: block;
    font-size: 22px;
    font-weight: 800;
    color: #0b2545;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
    line-height: 1;
    margin: 3px 0 2px;
}
.tnr-next-day {
    font-size: 11px;
    font-weight: 700;
    color: #e05c00;
    vertical-align: super;
    margin-left: 1px;
}

/* compact meta times */
.tnr-compact-times {
    font-weight: 700;
    color: #0b2545;
    font-variant-numeric: tabular-nums;
}
.tnr-compact-times sup {
    color: #e05c00;
    font-size: 10px;
}

/* badge time chip */
.tnr-badge-time {
    font-size: 12px;
    font-weight: 700;
    color: #0b2545;
    background: #dde8f8;
    padding: 1px 5px;
    border-radius: 3px;
    font-variant-numeric: tabular-nums;
}
.tnr-badge-time sup {
    color: #e05c00;
    font-size: 9px;
}

/* time input styling */
.tnr-field input[type="time"] {
    width: 100%;
    padding: 9px 12px;
    border: 2px solid #ddd;
    border-radius: 6px;
    font-size: 16px;
    font-family: 'DM Sans', sans-serif;
    font-weight: 600;
    color: #0b2545;
    box-sizing: border-box;
    transition: border-color .15s;
    cursor: pointer;
}
.tnr-field input[type="time"]:focus {
    border-color: #0b2545;
    outline: none;
    box-shadow: 0 0 0 3px rgba(11,37,69,.07);
}

/* ── AUTO-CALCULATE BAR ── */
.tnr-calc-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: -8px;
    margin-bottom: 16px;
    padding: 10px 14px;
    background: #f5faff;
    border: 2px solid #d0e8ff;
    border-radius: 8px;
}
.tnr-btn-sm {
    padding: 6px 14px;
    font-size: 12px;
}
.tnr-calc-result {
    font-size: 13px;
    font-weight: 600;
    transition: color .2s;
}
.tnr-calc-ok      { color: #155724; }
.tnr-calc-err     { color: #721c24; }
.tnr-calc-loading { color: #555; }

@keyframes tnr-spin { to { transform: rotate(360deg); } }
.tnr-spin {
    display: inline-block;
    animation: tnr-spin .6s linear infinite;
}

/* autofilled field highlight */
input.tnr-autofilled {
    border-color: #28a745 !important;
    background: #f0fff4;
}

/* ─── EMBEDDED LEAFLET MAP – Route ─── */
.tnr-route-map-wrap { margin-top: 16px; }
.tnr-route-map {
    width: 100%;
    height: 340px;
    border-radius: 10px;
    overflow: hidden;
    border: 1.5px solid #d0e8f0;
}
.tnr-map-credit {
    font-size: 11px;
    color: #888;
    margin: 4px 0 0;
    text-align: right;
}
.tnr-map-credit a { color: #51B1CB; }

/* Route map pins */
.tnr-map-pin { background: transparent !important; border: none !important; }
.tnr-pin-dep .tnr-pin-inner {
    width: 40px; height: 40px;
    background: #255A6D;
    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 3px 10px rgba(37,90,109,.4);
    border: 2px solid #fff;
}
.tnr-pin-arr .tnr-pin-inner {
    width: 40px; height: 40px;
    background: #6CAE5A;
    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 3px 10px rgba(108,174,90,.4);
    border: 2px solid #fff;
}
.tnr-pin-dep .tnr-pin-inner span,
.tnr-pin-arr .tnr-pin-inner span {
    transform: rotate(45deg);
    font-size: 18px;
    line-height: 1;
}

/* Distance label on map */
.tnr-dist-label { background: transparent !important; border: none !important; }
.tnr-dist-label span {
    display: inline-block;
    background: rgba(37,90,109,.85);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 12px;
    white-space: nowrap;
    font-family: "DM Sans", sans-serif;
    backdrop-filter: blur(2px);
}

