﻿/* Pro tables */
.table-pro {
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 1rem;
  overflow: hidden;
}
.table-pro thead th{
  background: rgba(0,0,0,.03);
  border-bottom: 1px solid rgba(0,0,0,.06);
  font-size: .75rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(0,0,0,.55);
  padding: .85rem .9rem;
  white-space: nowrap;
}
.table-pro tbody td{
  padding: .85rem .9rem;
  border-bottom: 1px solid rgba(0,0,0,.06);
  vertical-align: middle;
}
.table-pro tbody tr:hover{
  background: rgba(13,110,253,.04);
}
.table-pro tbody tr:last-child td{ border-bottom: 0; }

.table-toolbar{
  display:flex;
  gap:.75rem;
  align-items:center;
  justify-content:space-between;
  margin-bottom:.75rem;
}
.table-toolbar .form-control{
  max-width: 320px;
}
.badge-soft{
  background: rgba(13,110,253,.10);
  color:#0d6efd;
  font-weight: 800;
}
.badge-soft-success{
  background: rgba(25,135,84,.12);
  color:#198754;
  font-weight: 800;
}
.badge-soft-warning{
  background: rgba(255,193,7,.18);
  color:#8a6a00;
  font-weight: 800;
}
.badge-soft-danger{
  background: rgba(220,53,69,.12);
  color:#dc3545;
  font-weight: 800;
}
.action-pill{
  width: 36px; height: 36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: .85rem;
  background: rgba(0,0,0,.04);
  border: 1px solid rgba(0,0,0,.06);
}
.action-pill:hover{ background: rgba(0,0,0,.06); }
.empty-state{
  border: 1px dashed rgba(0,0,0,.12);
  border-radius: 1rem;
  padding: 1.25rem;
  text-align:center;
  color: rgba(0,0,0,.55);
  background: rgba(0,0,0,.02);
}
/* =========================
   Cards / KPIs (moved from _Overview.cshtml)
   ========================= */

.card-pro {
    border: 0;
    border-radius: 1.25rem;
    box-shadow: 0 .5rem 1.25rem rgba(0,0,0,.08);
    overflow: hidden;
}

    .card-pro .card-header {
        background: rgba(0,0,0,.02);
        border: 0;
    }

.section-title {
    font-size: .75rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(0,0,0,.55);
    font-weight: 800;
    margin: 1rem 0 .5rem;
}

.kpi {
    background: rgba(0,0,0,.03);
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 1rem;
    padding: .85rem;
}

    .kpi .label {
        font-size: .72rem;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: rgba(0,0,0,.55);
        font-weight: 800;
    }

    .kpi .value {
        font-size: 1.05rem;
        font-weight: 900;
    }

/* (opsiyonel) action-btn alias: bazı sayfalarda action-pill yerine kullanırsan aynı dursun */
.action-btn {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: .85rem;
    background: rgba(0,0,0,.04);
    border: 1px solid rgba(0,0,0,.06);
}

    .action-btn:hover {
        background: rgba(0,0,0,.06);
    }

/* =========================
   Pro Cards (Dashboard + Vessel cards)
   ========================= */

.card-pro {
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 .5rem 1.25rem rgba(0,0,0,.08);
    overflow: hidden;
    background: #fff;
}
.pillbar {
    background: rgba(0,0,0,.03);
    border-radius: 1.25rem;
    padding: .5rem;
}

    .pillbar .nav-link {
        border-radius: 1rem;
        font-weight: 600;
        color: rgba(0,0,0,.65);
    }

        .pillbar .nav-link.active {
            box-shadow: 0 .35rem 1rem rgba(0,0,0,.10);
        }

    .card-pro .card-header {
        background: rgba(0,0,0,.02);
        border: 0;
    }

/* Small stat cards (top KPIs) */
.stat-card .stat-title {
    font-size: .75rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(0,0,0,.55);
    font-weight: 800;
}

.stat-card .stat-value {
    font-size: 1.35rem;
    font-weight: 900;
    line-height: 1.15;
}

/* Vessel card left blue line */
.vessel-card {
    position: relative;
}

    .vessel-card::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 3px; /* ince mavi çizgi */
        background: #0d6efd; /* bootstrap primary */
        border-top-left-radius: 1rem;
        border-bottom-left-radius: 1rem;
        opacity: .95;
    }

/* =========================
           PRO DASHBOARD (local)
           ========================= */
.chartering-wrap {
    background: linear-gradient(180deg, rgba(13,110,253,.08) 0%, rgba(13,110,253,0) 55%);
    border-radius: 1.25rem;
    padding: 1.25rem;
}

.page-hero {
    border: 0;
    border-radius: 1.25rem;
    overflow: hidden;
    background: radial-gradient(900px 220px at 12% 0%, rgba(13,110,253,.22) 0%, rgba(13,110,253,0) 55%), radial-gradient(700px 220px at 85% 0%, rgba(25,135,84,.18) 0%, rgba(25,135,84,0) 55%), #fff;
    box-shadow: 0 .75rem 2rem rgba(0,0,0,.10);
}

.hero-sub {
    color: rgba(0,0,0,.55);
    font-size: .92rem;
}

.hero-actions .btn {
    border-radius: 999px;
    padding: .55rem 1rem;
    font-weight: 700;
}

.pro-card {
    border: 0;
    border-radius: 1.15rem;
    background: #fff;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    transition: transform .16s ease, box-shadow .16s ease;
    overflow: hidden;
}

    .pro-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 .85rem 2.1rem rgba(0,0,0,.12);
    }

.metric-card {
    position: relative;
    padding: 1.1rem 1.1rem 1rem 1.1rem;
}

    .metric-card::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(420px 140px at 15% 0%, rgba(13,110,253,.12) 0%, rgba(13,110,253,0) 60%), radial-gradient(420px 140px at 90% 0%, rgba(111,66,193,.10) 0%, rgba(111,66,193,0) 60%);
        pointer-events: none;
    }

.metric-head {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.metric-label {
    font-size: .78rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(0,0,0,.55);
    font-weight: 900;
}

.metric-value {
    position: relative;
    font-size: 1.35rem;
    font-weight: 950;
    margin-top: .4rem;
    line-height: 1.15;
}

.metric-foot {
    position: relative;
    margin-top: .25rem;
    color: rgba(0,0,0,.55);
    font-size: .82rem;
}

.icon-bubble {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(13,110,253,.12);
    color: #0d6efd;
    flex: 0 0 auto;
    border: 1px solid rgba(13,110,253,.18);
}

    .icon-bubble svg {
        width: 20px;
        height: 20px;
    }

.section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    margin-bottom: .6rem;
}

.section-title {
    font-weight: 900;
    font-size: 1.05rem;
    margin: 0;
}

.section-sub {
    margin: 0;
    color: rgba(0,0,0,.55);
    font-size: .9rem;
}

/* Vessel cards */
.vessel-card {
    position: relative;
    padding: 1.05rem;
}
    /* Sol dikine ince mavi çizgi */
    .vessel-card::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 4px;
        background: #0d6efd;
        opacity: .95;
    }

.vessel-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: .75rem;
}

.vessel-name {
    font-size: 1.05rem;
    font-weight: 950;
    margin: 0;
    line-height: 1.2;
}

.vessel-owner {
    color: rgba(0,0,0,.60);
    font-size: .88rem;
    margin-top: .15rem;
}

.chip {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .25rem .6rem;
    border-radius: 999px;
    background: rgba(0,0,0,.04);
    color: rgba(0,0,0,.72);
    font-size: .82rem;
    font-weight: 800;
    border: 1px solid rgba(0,0,0,.06);
    white-space: nowrap;
}

.btn-pill {
    border-radius: 999px !important;
    font-weight: 800;
    padding: .42rem .75rem;
}

.btn-pill-group .btn {
    border-radius: 999px !important;
}

.mini-kpi {
    background: rgba(0,0,0,.03);
    border: 1px solid rgba(0,0,0,.06);
    border-radius: .95rem;
    padding: .65rem .75rem;
}

    .mini-kpi .k {
        font-size: .72rem;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: rgba(0,0,0,.55);
        font-weight: 900;
    }

    .mini-kpi .v {
        font-weight: 950;
        margin-top: .15rem;
    }

.searchbox {
    max-width: 340px;
    border-radius: 999px;
    padding-left: 1rem;
    box-shadow: none;
    border: 1px solid rgba(0,0,0,.10);
}

    .searchbox:focus {
        border-color: rgba(13,110,253,.35);
        box-shadow: 0 0 0 .2rem rgba(13,110,253,.12);
    }

.empty-state {
    border: 1px dashed rgba(0,0,0,.18);
    border-radius: 1rem;
    padding: 1.25rem;
    background: rgba(255,255,255,.75);
    color: rgba(0,0,0,.6);
    text-align: center;
}

/* =========================
   Chartering - Top Actions (Sefer Listesi / Yeni Sefer)
   Only style these buttons.
   ========================= */

/* Eğer butonlar hero içinde ise */
.hero-actions .btn,
.chartering-actions .btn,
.chartering-wrap .page-hero .btn {
    border-radius: 999px !important;
    padding: .58rem 1.05rem !important;
    font-weight: 900 !important;
    letter-spacing: .02em;
    border-width: 1px;
    box-shadow: 0 .45rem 1.1rem rgba(0,0,0,.10);
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

    /* Hover: premium "lift" */
    .hero-actions .btn:hover,
    .chartering-actions .btn:hover,
    .chartering-wrap .page-hero .btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 .75rem 1.6rem rgba(0,0,0,.14);
        filter: brightness(1.02);
    }

    /* Active */
    .hero-actions .btn:active,
    .chartering-actions .btn:active,
    .chartering-wrap .page-hero .btn:active {
        transform: translateY(0);
        box-shadow: 0 .35rem .9rem rgba(0,0,0,.12);
    }

    /* Outline Primary = "Sefer Listesi" gibi */
    .hero-actions .btn.btn-outline-primary,
    .chartering-actions .btn.btn-outline-primary,
    .chartering-wrap .page-hero .btn.btn-outline-primary {
        background: rgba(255,255,255,.82);
        border-color: rgba(13,110,253,.35);
        color: #0d6efd;
        backdrop-filter: blur(6px);
    }

        .hero-actions .btn.btn-outline-primary:hover,
        .chartering-actions .btn.btn-outline-primary:hover,
        .chartering-wrap .page-hero .btn.btn-outline-primary:hover {
            background: rgba(13,110,253,.08);
            border-color: rgba(13,110,253,.55);
        }

    /* Primary = "Yeni Sefer" */
    .hero-actions .btn.btn-primary,
    .chartering-actions .btn.btn-primary,
    .chartering-wrap .page-hero .btn.btn-primary {
        background: linear-gradient(135deg, rgba(13,110,253,1) 0%, rgba(111,66,193,1) 100%);
        border-color: transparent;
    }

        .hero-actions .btn.btn-primary:hover,
        .chartering-actions .btn.btn-primary:hover,
        .chartering-wrap .page-hero .btn.btn-primary:hover {
            filter: brightness(1.03);
        }

    /* Focus ring (daha elit) */
    .hero-actions .btn:focus,
    .chartering-actions .btn:focus,
    .chartering-wrap .page-hero .btn:focus {
        outline: none;
        box-shadow: 0 0 0 .22rem rgba(13,110,253,.18), 0 .75rem 1.6rem rgba(0,0,0,.14);
    }
/* =========================
   FIX: Hero action buttons (Sefer Listesi / + Yeni Sefer)
   Only affects buttons inside the dashboard hero.
   ========================= */

.page-hero .hero-actions {
    display: flex;
    gap: .65rem;
    align-items: center;
}

    /* ortak pro ölçü */
    .page-hero .hero-actions .btn {
        height: 44px !important;
        padding: 0 1.05rem !important;
        border-radius: 999px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: .45rem;
        font-size: .92rem !important;
        font-weight: 850 !important;
        line-height: 1 !important;
        white-space: nowrap !important; /* iki satırı öldür */
        box-shadow: 0 .35rem .95rem rgba(0,0,0,.12) !important;
        border-width: 1px !important;
        transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
    }

        .page-hero .hero-actions .btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 .6rem 1.35rem rgba(0,0,0,.16) !important;
        }

        /* Sefer Listesi: cam gibi, pill */
        .page-hero .hero-actions .btn.btn-outline-primary {
            min-width: 132px; /* rozet gibi küçülüp iki satıra düşmesin */
            background: rgba(255,255,255,.80) !important;
            border-color: rgba(13,110,253,.30) !important;
            color: #0d6efd !important;
            backdrop-filter: blur(6px);
        }

            .page-hero .hero-actions .btn.btn-outline-primary:hover {
                background: rgba(13,110,253,.06) !important;
                border-color: rgba(13,110,253,.50) !important;
            }

        /* + Yeni Sefer: daha premium gradient, daha derli toplu */
        .page-hero .hero-actions .btn.btn-primary {
            min-width: 150px;
            border: 0 !important;
            background: linear-gradient(135deg, #0d6efd 0%, #6f42c1 100%) !important;
        }

            .page-hero .hero-actions .btn.btn-primary:hover {
                filter: brightness(1.03);
            }

        .page-hero .hero-actions .btn:focus {
            outline: none !important;
            box-shadow: 0 0 0 .22rem rgba(13,110,253,.18), 0 .6rem 1.35rem rgba(0,0,0,.16) !important;
        }
        .page-hero .hero-actions .btn i.bi {
            font-size: 1rem;
            line-height: 1;
            transform: translateY(-.5px);
        }

/* =========================
   Fixtures (Sefer Listesi) - PRO
   Scope: only fixtures page
   ========================= */

.fixtures-page .fixtures-hero {
    border-radius: 1.25rem;
    background: radial-gradient(900px 240px at 12% 0%, rgba(13,110,253,.18) 0%, rgba(13,110,253,0) 60%), radial-gradient(700px 220px at 88% 0%, rgba(111,66,193,.14) 0%, rgba(111,66,193,0) 55%), #fff;
    box-shadow: 0 .75rem 2rem rgba(0,0,0,.10);
    overflow: hidden;
}

    .fixtures-page .fixtures-hero .hero-sub {
        color: rgba(0,0,0,.55);
        font-size: .92rem;
    }

    .fixtures-page .fixtures-hero .btn {
        height: 44px;
        padding: 0 1.05rem;
        border-radius: 999px;
        font-weight: 900;
        white-space: nowrap;
        box-shadow: 0 .35rem .95rem rgba(0,0,0,.12);
        transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
    }

        .fixtures-page .fixtures-hero .btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 .6rem 1.35rem rgba(0,0,0,.16);
        }

        .fixtures-page .fixtures-hero .btn.btn-primary {
            border: 0;
            background: linear-gradient(135deg, #0d6efd 0%, #6f42c1 100%);
        }

        .fixtures-page .fixtures-hero .btn.btn-outline-secondary {
            background: rgba(255,255,255,.75);
            border-color: rgba(0,0,0,.15);
        }

.fixtures-page .filter-card {
    border-radius: 1.15rem;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    border: 0;
}

    .fixtures-page .filter-card .form-control,
    .fixtures-page .filter-card .form-select {
        border-radius: .95rem;
    }

.fx-chip {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .28rem .65rem;
    border-radius: 999px;
    background: rgba(0,0,0,.04);
    border: 1px solid rgba(0,0,0,.06);
    color: rgba(0,0,0,.72);
    font-size: .82rem;
    font-weight: 900;
    white-space: nowrap;
}

.fx-badge {
    display: inline-flex;
    align-items: center;
    padding: .28rem .6rem;
    border-radius: 999px;
    font-weight: 900;
    border: 1px solid rgba(0,0,0,.06);
    background: rgba(0,0,0,.04);
    color: rgba(0,0,0,.75);
}

.fx-badge-primary {
    background: rgba(13,110,253,.12);
    color: #0d6efd;
    border-color: rgba(13,110,253,.18);
}

.fx-badge-success {
    background: rgba(25,135,84,.12);
    color: #198754;
    border-color: rgba(25,135,84,.18);
}

.fx-badge-warning {
    background: rgba(255,193,7,.18);
    color: #8a6a00;
    border-color: rgba(255,193,7,.22);
}

.fx-badge-danger {
    background: rgba(220,53,69,.12);
    color: #dc3545;
    border-color: rgba(220,53,69,.18);
}

.fx-badge-purple {
    background: rgba(111,66,193,.12);
    color: #6f42c1;
    border-color: rgba(111,66,193,.18);
}

.fixtures-page .table-card {
    border: 0;
    border-radius: 1.15rem;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    overflow: hidden;
}

.fixtures-page .table-toolbar {
    padding: .85rem 1rem;
    background: rgba(0,0,0,.01);
    border-bottom: 1px solid rgba(0,0,0,.06);
}

.fixtures-page .action-btn {
    width: 36px;
    height: 36px;
    border-radius: .85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .fixtures-page .action-btn i.bi {
        line-height: 1;
        transform: translateY(-.5px);
    }

.fx-badge-secondary {
    background: rgba(108,117,125,.14);
    color: #6c757d;
    border-color: rgba(108,117,125,.18);
}

/* =========================
   Fixture P&L - PRO
   Scope: only P&L page
   ========================= */

.fixture-pnl-page .pnl-hero {
    border-radius: 1.25rem;
    background: radial-gradient(900px 240px at 12% 0%, rgba(25,135,84,.16) 0%, rgba(25,135,84,0) 60%), radial-gradient(700px 220px at 88% 0%, rgba(13,110,253,.16) 0%, rgba(13,110,253,0) 55%), #fff;
    box-shadow: 0 .75rem 2rem rgba(0,0,0,.10);
    overflow: hidden;
}

    .fixture-pnl-page .pnl-hero .hero-sub {
        color: rgba(0,0,0,.55);
        font-size: .92rem;
    }

    .fixture-pnl-page .pnl-hero .btn {
        height: 42px;
        padding: 0 .95rem;
        border-radius: 999px;
        font-weight: 900;
        white-space: nowrap;
        box-shadow: 0 .35rem .95rem rgba(0,0,0,.12);
        transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
    }

        .fixture-pnl-page .pnl-hero .btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 .6rem 1.35rem rgba(0,0,0,.16);
        }

        .fixture-pnl-page .pnl-hero .btn.btn-outline-secondary {
            background: rgba(255,255,255,.75);
            border-color: rgba(0,0,0,.15);
        }

        .fixture-pnl-page .pnl-hero .btn.btn-primary {
            border: 0;
            background: linear-gradient(135deg, #0d6efd 0%, #6f42c1 100%);
        }

/* KPI cards */
.fixture-pnl-page .pnl-metric {
    border: 0;
    border-radius: 1.15rem;
    background: #fff;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    overflow: hidden;
    position: relative;
    padding: 1.05rem 1.1rem;
}

    .fixture-pnl-page .pnl-metric::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(420px 140px at 15% 0%, rgba(13,110,253,.10) 0%, rgba(13,110,253,0) 60%), radial-gradient(420px 140px at 90% 0%, rgba(25,135,84,.10) 0%, rgba(25,135,84,0) 60%);
        pointer-events: none;
    }

    .fixture-pnl-page .pnl-metric .label {
        position: relative;
        font-size: .76rem;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: rgba(0,0,0,.55);
        font-weight: 900;
    }

    .fixture-pnl-page .pnl-metric .value {
        position: relative;
        margin-top: .4rem;
        font-weight: 950;
        font-size: 1.05rem;
        line-height: 1.2;
    }

    .fixture-pnl-page .pnl-metric .hint {
        position: relative;
        margin-top: .25rem;
        color: rgba(0,0,0,.55);
        font-size: .82rem;
    }

/* Cards */
.fixture-pnl-page .pnl-card {
    border: 0;
    border-radius: 1.15rem;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    overflow: hidden;
    background: #fff;
}

    .fixture-pnl-page .pnl-card .card-header {
        background: rgba(0,0,0,.02);
        border: 0;
    }

/* Table toolbar is already defined as .table-toolbar in your CSS pack.
   We scope minor extras here. */
.fixture-pnl-page .table-toolbar {
    padding: .85rem 1rem;
}

    .fixture-pnl-page .table-toolbar .form-control {
        border-radius: 999px;
        max-width: 320px;
    }

/* Better negative highlight */
.fixture-pnl-page .neg {
    color: #dc3545;
    font-weight: 900;
}

/* Make action icons align nicer (if used) */
.fixture-pnl-page i.bi {
    line-height: 1;
    transform: translateY(-.5px);
}

/* =========================
   Voyage Account (Sefer Hesabı / Vessel P&L) - PRO
   Scope: only VoyageAccount page
   ========================= */

.voyage-account-page .va-hero {
    border-radius: 1.25rem;
    background: radial-gradient(900px 240px at 12% 0%, rgba(13,110,253,.16) 0%, rgba(13,110,253,0) 60%), radial-gradient(700px 220px at 88% 0%, rgba(25,135,84,.14) 0%, rgba(25,135,84,0) 55%), #fff;
    box-shadow: 0 .75rem 2rem rgba(0,0,0,.10);
    overflow: hidden;
}

    .voyage-account-page .va-hero .hero-sub {
        color: rgba(0,0,0,.55);
        font-size: .92rem;
    }

    .voyage-account-page .va-hero .btn {
        height: 42px;
        padding: 0 .95rem;
        border-radius: 999px;
        font-weight: 900;
        white-space: nowrap;
        box-shadow: 0 .35rem .95rem rgba(0,0,0,.12);
        transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
    }

        .voyage-account-page .va-hero .btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 .6rem 1.35rem rgba(0,0,0,.16);
        }

        .voyage-account-page .va-hero .btn.btn-primary {
            border: 0;
            background: linear-gradient(135deg, #0d6efd 0%, #6f42c1 100%);
        }

        .voyage-account-page .va-hero .btn.btn-outline-secondary {
            background: rgba(255,255,255,.75);
            border-color: rgba(0,0,0,.15);
        }

/* KPI cards */
.voyage-account-page .va-metric {
    border: 0;
    border-radius: 1.15rem;
    background: #fff;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    overflow: hidden;
    position: relative;
    padding: 1.05rem 1.1rem;
}

    .voyage-account-page .va-metric::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(420px 140px at 15% 0%, rgba(13,110,253,.10) 0%, rgba(13,110,253,0) 60%), radial-gradient(420px 140px at 90% 0%, rgba(25,135,84,.10) 0%, rgba(25,135,84,0) 60%);
        pointer-events: none;
    }

    .voyage-account-page .va-metric .label {
        position: relative;
        font-size: .76rem;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: rgba(0,0,0,.55);
        font-weight: 900;
    }

    .voyage-account-page .va-metric .value {
        position: relative;
        margin-top: .4rem;
        font-weight: 950;
        font-size: 1.05rem;
        line-height: 1.2;
    }

    .voyage-account-page .va-metric .hint {
        position: relative;
        margin-top: .25rem;
        color: rgba(0,0,0,.55);
        font-size: .82rem;
    }

/* Table card */
.voyage-account-page .va-card {
    border: 0;
    border-radius: 1.15rem;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    overflow: hidden;
    background: #fff;
}

.voyage-account-page .table-toolbar {
    padding: .85rem 1rem;
    background: rgba(0,0,0,.01);
    border-bottom: 1px solid rgba(0,0,0,.06);
}

    .voyage-account-page .table-toolbar .form-control {
        border-radius: 999px;
        max-width: 320px;
    }

.voyage-account-page .action-btn {
    width: 36px;
    height: 36px;
    border-radius: .85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.voyage-account-page i.bi {
    line-height: 1;
    transform: translateY(-.5px);
}

.voyage-account-page .neg {
    color: #dc3545;
    font-weight: 900;
}

/* =========================
   Laytime - PRO
   Scope: only Laytime page
   ========================= */

.laytime-page .lt-hero {
    border-radius: 1.25rem;
    background: radial-gradient(900px 240px at 12% 0%, rgba(255,193,7,.20) 0%, rgba(255,193,7,0) 60%), radial-gradient(700px 220px at 88% 0%, rgba(13,110,253,.14) 0%, rgba(13,110,253,0) 55%), #fff;
    box-shadow: 0 .75rem 2rem rgba(0,0,0,.10);
    overflow: hidden;
}

    .laytime-page .lt-hero .hero-sub {
        color: rgba(0,0,0,.55);
        font-size: .92rem;
    }

    .laytime-page .lt-hero .btn {
        height: 42px;
        padding: 0 .95rem;
        border-radius: 999px;
        font-weight: 900;
        white-space: nowrap;
        box-shadow: 0 .35rem .95rem rgba(0,0,0,.12);
        transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
    }

        .laytime-page .lt-hero .btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 .6rem 1.35rem rgba(0,0,0,.16);
        }

.laytime-page .lt-card {
    border: 0;
    border-radius: 1.15rem;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    overflow: hidden;
    background: #fff;
}

    .laytime-page .lt-card .card-header {
        background: rgba(0,0,0,.02);
        border: 0;
    }

.laytime-page .lt-metric {
    border: 0;
    border-radius: 1.15rem;
    background: #fff;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    overflow: hidden;
    position: relative;
    padding: 1.05rem 1.1rem;
}

    .laytime-page .lt-metric::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(420px 140px at 15% 0%, rgba(13,110,253,.10) 0%, rgba(13,110,253,0) 60%), radial-gradient(420px 140px at 90% 0%, rgba(255,193,7,.12) 0%, rgba(255,193,7,0) 60%);
        pointer-events: none;
    }

    .laytime-page .lt-metric .label {
        position: relative;
        font-size: .76rem;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: rgba(0,0,0,.55);
        font-weight: 900;
    }

    .laytime-page .lt-metric .value {
        position: relative;
        margin-top: .4rem;
        font-weight: 950;
        font-size: 1.05rem;
        line-height: 1.2;
    }

    .laytime-page .lt-metric .hint {
        position: relative;
        margin-top: .25rem;
        color: rgba(0,0,0,.55);
        font-size: .82rem;
    }

.laytime-page .lt-badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .25rem .6rem;
    border-radius: 999px;
    font-weight: 950;
    border: 1px solid rgba(0,0,0,.06);
    background: rgba(0,0,0,.04);
    color: rgba(0,0,0,.75);
    white-space: nowrap;
}

.laytime-page .lt-badge-dem {
    background: rgba(220,53,69,.12);
    color: #dc3545;
    border-color: rgba(220,53,69,.18);
}

.laytime-page .lt-badge-des {
    background: rgba(25,135,84,.12);
    color: #198754;
    border-color: rgba(25,135,84,.18);
}

.laytime-page .lt-badge-ok {
    background: rgba(13,110,253,.12);
    color: #0d6efd;
    border-color: rgba(13,110,253,.18);
}

.laytime-page i.bi {
    line-height: 1;
    transform: translateY(-.5px);
}
/* =========================
   Vessel Summary (Sefer Özeti) - PRO
   Scope: only VesselSummary page
   ========================= */

.vessel-summary-page .vs-hero {
    border-radius: 1.25rem;
    background: radial-gradient(900px 240px at 12% 0%, rgba(13,110,253,.18) 0%, rgba(13,110,253,0) 60%), radial-gradient(700px 220px at 88% 0%, rgba(111,66,193,.14) 0%, rgba(111,66,193,0) 55%), #fff;
    box-shadow: 0 .75rem 2rem rgba(0,0,0,.10);
    overflow: hidden;
}

    .vessel-summary-page .vs-hero .hero-sub {
        color: rgba(0,0,0,.55);
        font-size: .92rem;
    }

    .vessel-summary-page .vs-hero .btn {
        height: 42px;
        padding: 0 .95rem;
        border-radius: 999px;
        font-weight: 900;
        white-space: nowrap;
        box-shadow: 0 .35rem .95rem rgba(0,0,0,.12);
        transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
    }

        .vessel-summary-page .vs-hero .btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 .6rem 1.35rem rgba(0,0,0,.16);
        }

        .vessel-summary-page .vs-hero .btn.btn-primary {
            border: 0;
            background: linear-gradient(135deg, #0d6efd 0%, #6f42c1 100%);
        }

        .vessel-summary-page .vs-hero .btn.btn-outline-secondary {
            background: rgba(255,255,255,.75);
            border-color: rgba(0,0,0,.15);
        }

.vessel-summary-page .vs-metric {
    border: 0;
    border-radius: 1.15rem;
    background: #fff;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    overflow: hidden;
    position: relative;
    padding: 1.05rem 1.1rem;
}

    .vessel-summary-page .vs-metric::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(420px 140px at 15% 0%, rgba(13,110,253,.10) 0%, rgba(13,110,253,0) 60%), radial-gradient(420px 140px at 90% 0%, rgba(25,135,84,.10) 0%, rgba(25,135,84,0) 60%);
        pointer-events: none;
    }

    .vessel-summary-page .vs-metric .label {
        position: relative;
        font-size: .76rem;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: rgba(0,0,0,.55);
        font-weight: 900;
    }

    .vessel-summary-page .vs-metric .value {
        position: relative;
        margin-top: .4rem;
        font-weight: 950;
        font-size: 1.25rem;
        line-height: 1.15;
    }

    .vessel-summary-page .vs-metric .hint {
        position: relative;
        margin-top: .25rem;
        color: rgba(0,0,0,.55);
        font-size: .82rem;
    }

.vessel-summary-page .vs-card {
    border: 0;
    border-radius: 1.15rem;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    overflow: hidden;
    background: #fff;
}

    .vessel-summary-page .vs-card .card-header {
        background: rgba(0,0,0,.02);
        border: 0;
    }

.vessel-summary-page .vs-placeholder {
    border: 1px dashed rgba(0,0,0,.18);
    border-radius: 1rem;
    padding: 1rem;
    background: rgba(255,255,255,.7);
    color: rgba(0,0,0,.60);
}

/* =========================
   Vessel Summary - 2026 polish
   Scope: .vessel-summary-page
   ========================= */

/* HERO alignment fix */
.vessel-summary-page .vs-hero .hero-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.vessel-summary-page .vs-hero .hero-actions {
    display: flex;
    align-items: center;
    gap: .6rem;
    flex-wrap: wrap;
}

    .vessel-summary-page .vs-hero .hero-actions .btn {
        display: inline-flex;
        align-items: center;
        gap: .55rem;
        padding: 0 1.05rem;
    }

/* TABLE readability */
.vessel-summary-page .vs-table th {
    font-size: .72rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(0,0,0,.55);
    white-space: nowrap;
}

.vessel-summary-page .vs-table td {
    vertical-align: middle;
}

    .vessel-summary-page .vs-table td.fx-cell {
        min-width: 210px;
    }

.vessel-summary-page .vs-table .fxno {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    font-weight: 950;
}

/* Money stack (no more ugly bullets) */
.vessel-summary-page .money-lines {
    display: flex;
    flex-direction: column;
    gap: 2px;
    align-items: flex-end;
}

.vessel-summary-page .money-line {
    display: flex;
    gap: 8px;
    align-items: baseline;
    font-variant-numeric: tabular-nums;
}

.vessel-summary-page .money-cur {
    font-size: .72rem;
    font-weight: 900;
    color: rgba(0,0,0,.55);
}

.vessel-summary-page .money-amt {
    font-weight: 950;
}

    .vessel-summary-page .money-amt.neg {
        color: #dc3545;
    }

/* Milestone pill (compact) */
.vessel-summary-page .ms-pill {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .22rem .6rem;
    border-radius: 999px;
    font-weight: 950;
    border: 1px solid rgba(0,0,0,.06);
    background: rgba(0,0,0,.04);
    white-space: nowrap;
}

.vessel-summary-page .ms-ok {
    background: rgba(25,135,84,.12);
    color: #198754;
    border-color: rgba(25,135,84,.18);
}

.vessel-summary-page .ms-bad {
    background: rgba(220,53,69,.12);
    color: #dc3545;
    border-color: rgba(220,53,69,.18);
}

.vessel-summary-page .ms-sub {
    margin-top: .25rem;
    font-size: .78rem;
    color: rgba(0,0,0,.55);
    font-weight: 700;
}

/* Missing docs pills */
.vessel-summary-page .doc-pills {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.vessel-summary-page .doc-pill {
    font-size: .72rem;
    font-weight: 950;
    border-radius: 999px;
    padding: .18rem .55rem;
    background: rgba(255,193,7,.18);
    border: 1px solid rgba(255,193,7,.22);
    color: #8a6a00;
    white-space: nowrap;
}

.vessel-summary-page .doc-ok {
    background: rgba(25,135,84,.12);
    border-color: rgba(25,135,84,.18);
    color: #198754;
}

/* Action group as one pill */
.vessel-summary-page .vs-actions {
    display: inline-flex;
    gap: 6px;
    padding: 6px;
    border-radius: 999px;
    background: rgba(255,255,255,.75);
    border: 1px solid rgba(0,0,0,.06);
    box-shadow: 0 .35rem .9rem rgba(0,0,0,.10);
    flex-wrap: nowrap;
}

    .vessel-summary-page .vs-actions .action-btn {
        width: 34px;
        height: 34px;
        border-radius: 12px;
    }


/* Dashboard hero action buttons */
.page-hero .hero-actions .btn-hero {
    height: 40px;
    padding: 0 .95rem;
    border-radius: 999px;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    box-shadow: 0 .35rem .9rem rgba(0,0,0,.10);
    background: rgba(255,255,255,.75);
    border-color: rgba(0,0,0,.14);
}

    .page-hero .hero-actions .btn-hero:hover {
        transform: translateY(-1px);
        box-shadow: 0 .55rem 1.15rem rgba(0,0,0,.14);
    }

    .page-hero .hero-actions .btn-hero i.bi {
        line-height: 1;
        transform: translateY(-.5px);
    }
/* =========================
   Global page hero + pro card
   ========================= */

.page-hero {
    border-radius: 1.25rem;
    background: radial-gradient(900px 240px at 12% 0%, rgba(13,110,253,.16) 0%, rgba(13,110,253,0) 60%), radial-gradient(700px 220px at 88% 0%, rgba(111,66,193,.14) 0%, rgba(111,66,193,0) 55%), #fff;
    box-shadow: 0 .75rem 2rem rgba(0,0,0,.10);
    overflow: hidden;
}

    .page-hero .hero-sub {
        color: rgba(0,0,0,.55);
        font-size: .92rem;
    }

    .page-hero .hero-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        flex-wrap: wrap;
    }

    .page-hero .hero-actions {
        display: flex;
        align-items: center;
        gap: .6rem;
        flex-wrap: wrap;
    }

        /* Pill buttons (senin istediğin gibi) */
        .page-hero .hero-actions .btn-hero {
            height: 40px;
            padding: 0 .95rem;
            border-radius: 999px;
            font-weight: 900;
            display: inline-flex;
            align-items: center;
            gap: .55rem;
            box-shadow: 0 .35rem .9rem rgba(0,0,0,.10);
            background: rgba(255,255,255,.75);
            border-color: rgba(0,0,0,.14);
            transition: transform .14s ease, box-shadow .14s ease;
        }

            .page-hero .hero-actions .btn-hero:hover {
                transform: translateY(-1px);
                box-shadow: 0 .55rem 1.15rem rgba(0,0,0,.14);
            }

            .page-hero .hero-actions .btn-hero i.bi {
                line-height: 1;
                transform: translateY(-.5px);
            }

/* Pro card */
.card-pro {
    border: 0;
    border-radius: 1.15rem;
    box-shadow: 0 .55rem 1.4rem rgba(0,0,0,.08);
    overflow: hidden;
    background: #fff;
}

.create-fixture-page .section-title {
    font-weight: 950;
    letter-spacing: .02em;
}

.create-fixture-page .section-sub {
    color: rgba(0,0,0,.55);
    font-size: .85rem;
}

.vessel-summary-page .fx-chip {
    border: 0;
    cursor: pointer;
}

.vessel-summary-page tr.row-flash {
    animation: rowFlash 1.4s ease;
}

@keyframes rowFlash {
    0% {
        box-shadow: inset 0 0 0 9999px rgba(13,110,253,.12);
    }

    100% {
        box-shadow: inset 0 0 0 0 rgba(13,110,253,0);
    }
}