:root{
    --navy:#071827;
    --navy2:#10283b;
    --gold:#c9a45c;
    --blue:#0088ce;
    --green:#3bb273;
    --white:#fff;
    --muted:#aebbc5;
    --line:rgba(255,255,255,.14);
    --error:#d85d5d;
}
*{box-sizing:border-box}
body{
    margin:0;
    font-family:Arial,Helvetica,sans-serif;
    background:
        radial-gradient(circle at top right,rgba(0,136,206,.12),transparent 35%),
        var(--navy);
    color:var(--white);
    min-height:100vh;
}
a{color:#69c7f3}
.topbar{
    border-bottom:1px solid var(--line);
    background:rgba(7,24,39,.97);
    padding:20px 24px;
}
.topbar-inner{
    margin:auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
}
.brand{
    text-decoration:none;
    color:white;
    font-size:22px;
    font-weight:800;
    letter-spacing:.02em;
}
.brand span{color:var(--gold)}
.brand img{
    display:block;
    width:auto;
    height:34px;
    max-width:260px;
    object-fit:contain;
}

body.floorlayer-workspace .job-summary-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
}
.brand-logo{
    display:inline-flex;
    align-items:center;
}
.brand-logo img{
    display:block;
    width:190px;
    height:46px;
    object-fit:contain;
    object-position:left center;
}
.footer-logo{
    display:inline-flex;
    align-items:center;
}
.footer-logo img{
    display:block;
    width:180px;
    height:46px;
    object-fit:contain;
    object-position:left center;
}
.topnav{display:flex;gap:16px;align-items:center}
.topnav a{color:#d7e2e8;text-decoration:none;font-size:14px}
.page{
    max-width:920px;
    margin:auto;
    padding:56px 24px 90px;
}
.narrow{max-width:680px}
.eyebrow{
    color:var(--gold);
    font-weight:800;
    font-size:13px;
    letter-spacing:.15em;
    text-transform:uppercase;
    margin-bottom:10px;
}
h1{
    margin:0 0 14px;
    font-size:clamp(38px,6vw,58px);
    line-height:1.04;
}
.lead{
    margin:0 0 30px;
    color:var(--muted);
    font-size:17px;
    line-height:1.6;
}
.card{
    background:rgba(16,40,59,.88);
    border:1px solid var(--line);
    border-radius:18px;
    padding:30px;
    box-shadow:0 24px 60px rgba(0,0,0,.22);
}
.grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}
.full{grid-column:1/-1}
label.field{
    display:block;
    margin:0 0 7px;
    font-size:14px;
    font-weight:800;
}
input,select,textarea{
    width:100%;
    padding:13px 14px;
    border-radius:9px;
    border:1px solid rgba(255,255,255,.18);
    background:#0c2030;
    color:white;
    font:inherit;
}
input:focus,select:focus,textarea:focus{
    outline:2px solid rgba(0,136,206,.55);
    outline-offset:1px;
}
.help{
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
    margin-top:6px;
}
.checks{
    display:grid;
    gap:12px;
}
.check{
    display:flex;
    align-items:flex-start;
    gap:10px;
    color:#e0e8ed;
    line-height:1.45;
    font-size:14px;
}
.check input{
    width:auto;
    margin-top:3px;
}
.role-box{
    border:1px solid rgba(255,255,255,.15);
    border-radius:12px;
    padding:16px;
    background:rgba(255,255,255,.035);
}
.section-title{
    font-size:18px;
    margin:4px 0 14px;
}
.actions{
    margin-top:24px;
    display:flex;
    align-items:center;
    gap:14px;
    flex-wrap:wrap;
}
.button{
    display:inline-block;
    border:0;
    border-radius:10px;
    background:var(--gold);
    color:var(--navy);
    padding:14px 19px;
    font-weight:900;
    text-decoration:none;
    cursor:pointer;
    font-size:15px;
}
.button.secondary{
    background:#17364d;
    color:white;
    border:1px solid rgba(255,255,255,.16);
}
.message{
    padding:14px 16px;
    border-radius:10px;
    margin:0 0 20px;
    line-height:1.5;
}
.message.error{
    background:rgba(216,93,93,.12);
    border:1px solid rgba(216,93,93,.45);
}
.message.success{
    background:rgba(59,178,115,.13);
    border:1px solid rgba(59,178,115,.45);
}
.message.info{
    background:rgba(0,136,206,.11);
    border:1px solid rgba(0,136,206,.38);
}
.divider{
    height:1px;
    background:var(--line);
    margin:24px 0;
}
.dashboard-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}
.dashboard-card{
    background:rgba(16,40,59,.88);
    border:1px solid var(--line);
    border-radius:16px;
    padding:22px;
}
.dashboard-card h2{margin:0 0 10px;font-size:20px}
.status{
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:7px 10px;
    border-radius:999px;
    background:rgba(59,178,115,.13);
    border:1px solid rgba(59,178,115,.4);
    font-size:12px;
    font-weight:800;
}
.dot{
    width:8px;height:8px;border-radius:50%;background:var(--green)
}
.small{font-size:13px;color:var(--muted);line-height:1.55}
.website-field{
    position:absolute!important;
    left:-9999px!important;
    width:1px!important;
    height:1px!important;
    overflow:hidden!important;
}
@media(max-width:720px){
    .grid,.dashboard-grid{grid-template-columns:1fr}
    .full{grid-column:auto}
    .card{padding:22px 18px}
    .topbar-inner{align-items:flex-start;flex-direction:column}
}


textarea{
    resize:vertical;
    min-height:120px;
}
.skill-picker{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
}
.skill-check{
    display:flex;
    align-items:center;
    gap:9px;
    min-height:46px;
    padding:10px 12px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:10px;
    background:rgba(255,255,255,.035);
    color:#e4edf2;
    font-size:13px;
    line-height:1.3;
    cursor:pointer;
}
.skill-check:hover{
    border-color:rgba(201,164,92,.5);
}
.skill-check input{
    width:auto;
    flex:0 0 auto;
}
.card-heading-row{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:14px;
    margin-bottom:16px;
}
.card-heading-row h2{
    margin:0;
}
.requirements-card{
    grid-column:1/-1;
}
.requirement-list{
    display:grid;
    gap:10px;
    margin:16px 0;
}
.requirement-row{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:center;
    padding:14px;
    border-radius:11px;
    border:1px solid rgba(255,255,255,.11);
    background:rgba(255,255,255,.03);
}
.requirement-main{
    display:grid;
    gap:5px;
}
.requirement-meta{
    display:flex;
    align-items:center;
    gap:10px;
    flex:0 0 auto;
}
.mini-status{
    display:inline-flex;
    align-items:center;
    padding:5px 8px;
    border-radius:999px;
    border:1px solid rgba(201,164,92,.38);
    background:rgba(201,164,92,.1);
    color:#f0d79e;
    font-size:10px;
    font-weight:900;
    letter-spacing:.05em;
}
.empty-state{
    display:grid;
    gap:6px;
    padding:18px;
    border:1px dashed rgba(255,255,255,.18);
    border-radius:12px;
    color:#e2ebf0;
}
.empty-state span{
    color:var(--muted);
    font-size:13px;
    line-height:1.5;
}
@media(max-width:800px){
    .skill-picker{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media(max-width:560px){
    .skill-picker{
        grid-template-columns:1fr;
    }
    .card-heading-row,
    .requirement-row{
        flex-direction:column;
        align-items:stretch;
    }
    .requirement-meta{
        justify-content:space-between;
    }
}


/* Jobs & Matches dashboard */
.job-summary-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin:18px 0 24px;
}
.job-summary{
    display:grid;
    gap:4px;
    padding:16px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,.11);
    background:rgba(255,255,255,.035);
}
.job-summary-number{
    font-size:27px;
    line-height:1;
    font-weight:900;
    color:#fff;
}
.job-summary-label{
    color:var(--muted);
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
}
.jobs-section-heading{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:16px;
    margin:6px 0 12px;
}
.jobs-section-heading h3{margin:0;font-size:17px}
.previous-heading{margin-top:28px}
.jobs-table-wrap{
    border:1px solid rgba(255,255,255,.11);
    border-radius:12px;
}
.jobs-table{
    width:100%;
    border-collapse:collapse;
    min-width:760px;
}
.jobs-table th,
.jobs-table td{
    padding:13px 14px;
    text-align:left;
    border-bottom:1px solid rgba(255,255,255,.08);
}
.jobs-table th{
    background:rgba(255,255,255,.04);
    color:#aebfca;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.05em;
}
.jobs-table td{color:#e7eef2;font-size:13px}
.jobs-table tbody tr:last-child td{border-bottom:0}
.jobs-table tbody tr:hover{background:rgba(255,255,255,.025)}
.match-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:30px;
    height:28px;
    padding:0 8px;
    border-radius:999px;
    background:rgba(75,148,196,.14);
    border:1px solid rgba(75,148,196,.35);
    font-weight:900;
}
.job-status{
    display:inline-flex;
    align-items:center;
    white-space:nowrap;
    padding:6px 9px;
    border-radius:999px;
    font-size:10px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.04em;
}
.status-live{
    color:#f0d79e;
    background:rgba(201,164,92,.12);
    border:1px solid rgba(201,164,92,.4);
}
.status-matches{
    color:#b9e5ff;
    background:rgba(42,132,190,.13);
    border:1px solid rgba(42,132,190,.4);
}
.status-filled,
.status-completed{
    color:#bff3d2;
    background:rgba(61,174,112,.13);
    border:1px solid rgba(61,174,112,.42);
}
.status-closed{
    color:#c5cdd2;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.16);
}
.previous-job-list{display:grid;gap:9px}
.previous-job-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:14px;
    padding:12px 14px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.09);
    background:rgba(255,255,255,.025);
}
.previous-job-row > div{display:grid;gap:3px}
.empty-state.compact{padding:14px 16px}
.dashboard-note{
    margin:20px 0 0;
    padding-top:16px;
    border-top:1px solid rgba(255,255,255,.08);
}
@media(max-width:800px){
    .job-summary-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media(max-width:560px){
    .jobs-section-heading,
    .previous-job-row{
        align-items:stretch;
        flex-direction:column;
    }
}


/* ==========================================================
   Floorlayer Connect permanent status colour language
   Yellow = live / waiting
   Blue   = match / action available
   Green  = filled / booked / completed
   Grey   = closed / declined / archived
   ========================================================== */

.job-summary{
    position:relative;
    overflow:hidden;
}

.job-summary::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:4px;
    border-radius:12px 0 0 12px;
}

.summary-live{
    border-color:rgba(201,164,92,.32);
    background:rgba(201,164,92,.055);
}
.summary-live::before{
    background:#c9a45c;
}
.summary-live .job-summary-number{
    color:#f0d79e;
}

.summary-matches{
    border-color:rgba(42,132,190,.34);
    background:rgba(42,132,190,.055);
}
.summary-matches::before{
    background:#2a84be;
}
.summary-matches .job-summary-number{
    color:#b9e5ff;
}

.summary-filled{
    border-color:rgba(61,174,112,.34);
    background:rgba(61,174,112,.055);
}
.summary-filled::before{
    background:#3dae70;
}
.summary-filled .job-summary-number{
    color:#bff3d2;
}

.summary-completed{
    border-color:rgba(255,255,255,.15);
    background:rgba(255,255,255,.035);
}
.summary-completed::before{
    background:#87949d;
}
.summary-completed .job-summary-number{
    color:#d2d9dd;
}

/* Floorlayer mirror statuses, ready for Work & Matches */
.status-new-match,
.status-potential-job{
    color:#b9e5ff;
    background:rgba(42,132,190,.13);
    border:1px solid rgba(42,132,190,.4);
}

.status-interested,
.status-waiting{
    color:#f0d79e;
    background:rgba(201,164,92,.12);
    border:1px solid rgba(201,164,92,.4);
}

.status-booked,
.status-work-completed{
    color:#bff3d2;
    background:rgba(61,174,112,.13);
    border:1px solid rgba(61,174,112,.42);
}

.status-declined,
.status-archived{
    color:#c5cdd2;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.16);
}


/* Floorlayer profile / availability / work & matches */
.availability-choice-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    margin-bottom:22px;
}
.availability-choice{
    display:flex;
    align-items:flex-start;
    gap:11px;
    min-height:104px;
    padding:16px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,.13);
    background:rgba(255,255,255,.035);
    cursor:pointer;
}
.availability-choice:hover{
    border-color:rgba(201,164,92,.45);
}
.availability-choice input{
    width:auto;
    margin-top:3px;
    flex:0 0 auto;
}
.availability-choice span{
    display:grid;
    gap:5px;
}
.availability-choice strong{
    color:#fff;
}
.availability-choice small{
    color:var(--muted);
    line-height:1.45;
}
.availability-fields{
    margin-top:4px;
}
.match-score-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:44px;
    height:30px;
    padding:0 9px;
    border-radius:999px;
    background:rgba(42,132,190,.13);
    border:1px solid rgba(42,132,190,.38);
    color:#b9e5ff;
    font-weight:900;
}
.match-actions{
    display:flex;
    gap:7px;
    align-items:center;
}
.match-actions form{
    margin:0;
}
.mini-action{
    border:0;
    border-radius:7px;
    padding:7px 9px;
    font:inherit;
    font-size:11px;
    font-weight:800;
    cursor:pointer;
    white-space:nowrap;
}
.mini-action.interested{
    background:rgba(42,132,190,.18);
    border:1px solid rgba(42,132,190,.42);
    color:#c7ebff;
}
.mini-action.decline{
    background:rgba(255,255,255,.055);
    border:1px solid rgba(255,255,255,.15);
    color:#cad4da;
}
.mini-action:hover{
    transform:translateY(-1px);
}
@media(max-width:800px){
    .availability-choice-grid{
        grid-template-columns:1fr;
    }
}


/* ==========================================================
   Floorlayer Work & Matches table
   Fit cleanly inside the dashboard card without horizontal scrolling.
   ========================================================== */

.floorlayer-jobs-table{
    width:100%;
    min-width:0;
    table-layout:fixed;
}

.floorlayer-jobs-table th,
.floorlayer-jobs-table td{
    padding-left:10px;
    padding-right:10px;
}

.floorlayer-jobs-table .job-status{
    white-space:normal;
    text-align:center;
    line-height:1.2;
}

.floorlayer-jobs-table .match-actions{
    display:grid;
    gap:6px;
    align-items:stretch;
}

.floorlayer-jobs-table .match-actions form{
    width:100%;
}

.floorlayer-jobs-table .mini-action{
    width:100%;
    white-space:normal;
    line-height:1.15;
    padding:7px 6px;
}

@media(max-width:900px){
    .floorlayer-jobs-table th,
    .floorlayer-jobs-table td{
        padding-left:7px;
        padding-right:7px;
        font-size:12px;
    }

    .floorlayer-jobs-table th{
        font-size:10px;
    }

    .floorlayer-jobs-table .match-score-pill{
        min-width:38px;
        padding:0 6px;
    }
}


/* ==========================================================
   Work & Matches compact desktop table v2
   Seven columns. Status and actions share the final column.
   ========================================================== */

/* Neutralise the old eighth-column width rule. */

.status-action-cell{
    justify-items:start;
}

.status-action-cell .job-status{
    width:auto;
    max-width:100%;
}

.status-action-cell .match-actions{
    flex-wrap:wrap;
}

.status-action-cell .match-actions form{
    min-width:0;
}

.status-action-cell .mini-action{
    min-width:0;
}

.single-match-action{
    margin:0;
    width:100%;
    max-width:100px;
}

@media(max-width:900px){
    .floorlayer-jobs-table th,
    .floorlayer-jobs-table td{
        padding:10px 6px;
    }

    .floorlayer-jobs-table th:nth-child(2),
    .floorlayer-jobs-table td:nth-child(2){
        width:20%;
    }

    .floorlayer-jobs-table th:nth-child(7),
    .floorlayer-jobs-table td:nth-child(7){
        width:24%;
    }
}


/* ==========================================================
   Work & Matches compact desktop table v3
   Six columns: Job | Location | Start | Duration | Rate | Match/Action
   ========================================================== */

/* Neutralise older seventh/eighth column rules. */
.floorlayer-jobs-table th:nth-child(7),
.floorlayer-jobs-table td:nth-child(7),
.floorlayer-jobs-table th:nth-child(8),
.floorlayer-jobs-table td:nth-child(8){
    width:auto !important;
}

.status-action-cell{
    display:flex !important;
    flex-wrap:wrap;
    align-items:center;
    gap:6px 8px;
}

.status-action-cell .match-score-pill,
.status-action-cell .job-status{
    flex:0 0 auto;
}

.status-action-cell .match-actions{
    display:flex !important;
    flex:1 1 100%;
    gap:6px;
    width:100%;
}

.status-action-cell .match-actions form{
    flex:0 1 auto;
    width:auto;
}

.status-action-cell .mini-action{
    width:auto !important;
    white-space:nowrap !important;
    padding:6px 10px !important;
    font-size:11px !important;
}

@media(max-width:900px){
    .floorlayer-jobs-table th,
    .floorlayer-jobs-table td{
        font-size:12px;
    }

    .floorlayer-jobs-table th:nth-child(2),
    .floorlayer-jobs-table td:nth-child(2){
        width:20% !important;
    }

    .floorlayer-jobs-table th:nth-child(6),
    .floorlayer-jobs-table td:nth-child(6){
        width:31% !important;
    }
}


/* ==========================================================
   Work & Matches clean table v4
   Job | Location | Start | Duration | Rate | Match | Action
   ========================================================== */

.jobs-table-wrap{
    overflow-x:hidden !important;
}

.floorlayer-jobs-table,
.jobs-table.floorlayer-jobs-table{
    width:100% !important;
    min-width:0 !important;
    table-layout:fixed !important;
}

.floorlayer-jobs-table th,
.floorlayer-jobs-table td{
    box-sizing:border-box;
    padding:13px 8px !important;
    vertical-align:middle;
    overflow-wrap:normal !important;
    word-break:normal !important;
}

.floorlayer-jobs-table th:nth-child(1),
.floorlayer-jobs-table td:nth-child(1){
    width:10% !important;
}

.floorlayer-jobs-table th:nth-child(2),
.floorlayer-jobs-table td:nth-child(2){
    width:21% !important;
}

.floorlayer-jobs-table th:nth-child(3),
.floorlayer-jobs-table td:nth-child(3){
    width:13% !important;
}

.floorlayer-jobs-table th:nth-child(4),
.floorlayer-jobs-table td:nth-child(4){
    width:12% !important;
}

.floorlayer-jobs-table th:nth-child(5),
.floorlayer-jobs-table td:nth-child(5){
    width:12% !important;
}

.floorlayer-jobs-table th:nth-child(6),
.floorlayer-jobs-table td:nth-child(6){
    width:10% !important;
}

.floorlayer-jobs-table th:nth-child(7),
.floorlayer-jobs-table td:nth-child(7){
    width:22% !important;
}

.floorlayer-jobs-table th:nth-child(8),
.floorlayer-jobs-table td:nth-child(8){
    width:auto !important;
}

.floorlayer-jobs-table .match-score-pill{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    white-space:nowrap !important;
    min-width:48px !important;
    height:30px;
    padding:0 9px !important;
}

.clean-action-cell{
    display:flex;
    align-items:center;
    min-height:34px;
}

.clean-action-cell .match-actions{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center;
    gap:6px;
    width:100%;
}

.clean-action-cell .match-actions form{
    margin:0;
    width:auto !important;
    flex:0 1 auto !important;
}

.clean-action-cell .mini-action{
    width:auto !important;
    min-width:0 !important;
    white-space:nowrap !important;
    padding:7px 10px !important;
    font-size:11px !important;
}

.progress-action{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:7px;
}

.progress-action form{
    margin:0;
}

.action-state{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:5px 10px;
    border-radius:8px;
    font-size:11px;
    font-weight:900;
    white-space:nowrap;
}

.interested-state{
    color:#f0d79e;
    background:rgba(201,164,92,.12);
    border:1px solid rgba(201,164,92,.4);
}

.booked-state,
.completed-state{
    color:#bff3d2;
    background:rgba(61,174,112,.13);
    border:1px solid rgba(61,174,112,.42);
}

@media(max-width:900px){
    .floorlayer-jobs-table th,
    .floorlayer-jobs-table td{
        padding:11px 6px !important;
        font-size:12px;
    }

    .floorlayer-jobs-table th{
        font-size:10px;
    }

    .clean-action-cell .match-actions{
        flex-direction:column;
        align-items:flex-start;
        gap:5px;
    }
}


/* ==========================================================
   Work & Matches header/value alignment v5
   Keep Job/Location left aligned, centre the data columns.
   ========================================================== */

.floorlayer-jobs-table th:nth-child(1),
.floorlayer-jobs-table td:nth-child(1),
.floorlayer-jobs-table th:nth-child(2),
.floorlayer-jobs-table td:nth-child(2){
    text-align:left !important;
}

.floorlayer-jobs-table th:nth-child(3),
.floorlayer-jobs-table td:nth-child(3),
.floorlayer-jobs-table th:nth-child(4),
.floorlayer-jobs-table td:nth-child(4),
.floorlayer-jobs-table th:nth-child(5),
.floorlayer-jobs-table td:nth-child(5),
.floorlayer-jobs-table th:nth-child(6),
.floorlayer-jobs-table td:nth-child(6),
.floorlayer-jobs-table th:nth-child(7),
.floorlayer-jobs-table td:nth-child(7){
    text-align:center !important;
}

.floorlayer-jobs-table td:nth-child(6) .match-score-pill{
    margin-left:auto;
    margin-right:auto;
}

.floorlayer-jobs-table td:nth-child(7) .clean-action-cell{
    justify-content:center;
}

.floorlayer-jobs-table td:nth-child(7) .match-actions{
    justify-content:center;
}

.floorlayer-jobs-table td:nth-child(7) .progress-action{
    justify-content:center;
}


/* ==========================================================
   Skill-based rates v1
   ========================================================== */

.rate-builder{
    display:grid;
    gap:10px;
}

.rate-builder-empty{
    padding:18px;
    border:1px dashed rgba(255,255,255,.18);
    border-radius:12px;
    color:var(--muted);
    background:rgba(255,255,255,.025);
}

.rate-row{
    display:grid;
    grid-template-columns:minmax(220px,1.5fr) minmax(120px,.6fr) minmax(180px,.8fr);
    gap:12px;
    align-items:end;
    padding:14px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:12px;
    background:rgba(255,255,255,.03);
}

.rate-item-name{
    align-self:center;
    color:#fff;
}

.rate-mini-label{
    display:block;
    margin:0 0 6px;
    color:var(--muted);
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.6px;
}

.subfloor-rate-group{
    display:grid;
    gap:10px;
    padding:14px;
    border:1px solid rgba(201,164,92,.28);
    border-radius:14px;
    background:rgba(201,164,92,.045);
}

.subfloor-rate-heading{
    display:grid;
    gap:3px;
    margin-bottom:2px;
}

.subfloor-rate-heading strong{
    color:#fff;
    font-size:15px;
}

.subfloor-rate-heading span{
    color:var(--muted);
    font-size:12px;
}

.subfloor-rate-item{
    display:grid;
    gap:8px;
}

.subfloor-rate-check{
    display:flex;
    align-items:center;
    gap:9px;
    color:#fff;
    cursor:pointer;
}

.subfloor-rate-check input{
    width:auto;
    flex:0 0 auto;
}

.subfloor-rate-fields[hidden]{
    display:none !important;
}

.job-rate-details{
    position:relative;
}

.job-rate-details summary{
    display:inline-flex;
    align-items:center;
    cursor:pointer;
    color:#b9e5ff;
    font-weight:800;
    white-space:nowrap;
}

.job-rate-panel{
    position:absolute;
    z-index:30;
    top:calc(100% + 7px);
    left:50%;
    transform:translateX(-50%);
    width:min(360px,70vw);
    padding:10px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:11px;
    background:#0c2334;
    box-shadow:0 14px 35px rgba(0,0,0,.35);
    text-align:left;
}

.job-rate-line{
    display:flex;
    justify-content:space-between;
    gap:14px;
    padding:8px 6px;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.job-rate-line:last-child{
    border-bottom:0;
}

.job-rate-line span{
    color:var(--muted);
}

.job-rate-line strong{
    color:#fff;
    white-space:nowrap;
}

.single-job-rate{
    white-space:nowrap;
}

@media(max-width:760px){
    .rate-row{
        grid-template-columns:1fr;
    }
}

/* Account security policy */
body:has(.security-policy-page){
    background:#eef2f5;
    color:#10283b;
}
body:has(.security-policy-page) .security-policy-page h1{
    color:#071827;
}
body:has(.security-policy-page) .lead{
    color:#425766;
}
.policy-card{
    color:#e9f0f4;
}
.policy-card section{
    padding:20px 0;
    border-top:1px solid rgba(255,255,255,.1);
}
.policy-card section:first-of-type{
    border-top:0;
}
.policy-card h2{
    margin:0 0 8px;
    color:#fff;
    font-size:19px;
}
.policy-card p{
    margin:0;
    color:#c8d4dc;
    line-height:1.7;
}
.policy-updated{
    margin-bottom:15px !important;
    color:#efdaae !important;
}


/* ==========================================================
   Inline skill + rate layout v2
   ========================================================== */

.inline-skill-rate-row,
.inline-subfloor-group{
    border:1px solid rgba(255,255,255,.13);
    border-radius:11px;
    background:rgba(255,255,255,.025);
}

.inline-skill-check{
    display:flex;
    align-items:center;
    gap:9px;
    color:#fff;
    cursor:pointer;
    font-weight:700;
}

.inline-skill-check input{
    width:auto;
    flex:0 0 auto;
}

.inline-skill-check span{
    min-width:0;
}

.inline-rate-entry{
    white-space:nowrap;
}

.inline-rate-input:disabled{
    opacity:.35;
    cursor:not-allowed;
}

.currency-prefix,
.inline-rate-basis{
    color:var(--muted);
    font-size:12px;
    font-weight:800;
}

.inline-subfloor-group{
    grid-column:1 / -1;
    padding:12px;
}

.inline-skill-check.parent{
    margin-bottom:9px;
}

.subfloor-inline-children{
    display:grid;
    gap:8px;
    padding-top:8px;
    border-top:1px solid rgba(255,255,255,.09);
}

.subfloor-inline-children[hidden]{
    display:none !important;
}

.inline-subfloor-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    padding:9px 10px;
    border-radius:8px;
    background:rgba(255,255,255,.025);
}

.inline-subfloor-row.selected{
    background:rgba(201,164,92,.045);
}

.inline-skill-check.child{
    padding-left:18px;
    font-weight:600;
}

@media(max-width:800px){
    .inline-skill-rate-grid{
        grid-template-columns:1fr;
    }

    .inline-skill-rate-row,
    .inline-subfloor-row{
        grid-template-columns:1fr;
    }

    .inline-rate-entry{
    padding-left:31px;
    display:none !important;
}

.inline-skill-rate-row:has(input[type="checkbox"]:checked) .inline-rate-entry{
    display:flex !important;
    align-items:center !important;
}

.saved-default-rate{
    display:none !important;
}
}


/* ==========================================================
   Rate field cleanup + 14-skill layout v3
   ========================================================== */

/* Remove browser number-input spinner arrows. */
.inline-rate-input{
    appearance:textfield;
    -moz-appearance:textfield;
}

.inline-rate-input::-webkit-outer-spin-button,
.inline-rate-input::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0;
}

/* Keep the price field tidy and visually balanced. */

/* Old expandable subfloor styles are no longer used. */
.inline-subfloor-group,
.subfloor-inline-children,
.inline-subfloor-row{
    display:none !important;
}


/* ==========================================================
   Company Default Rate Card v1
   ========================================================== */

.company-rate-card-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}

.company-rate-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    padding:12px 13px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:11px;
    background:rgba(255,255,255,.025);
}

.company-rate-name{
    color:#fff;
    font-weight:700;
    line-height:1.3;
}

.company-rate-entry{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:6px;
    white-space:nowrap;
}

.company-rate-symbol,
.company-rate-basis{
    color:var(--muted);
    font-size:12px;
    font-weight:800;
}

.company-rate-input{
    width:86px !important;
    min-width:86px;
    padding:8px 9px !important;
    text-align:right;
}

.saved-default-rate{
    grid-column:1 / -1;
    margin-top:-3px;
    color:#90a9ba;
    font-size:10px;
    line-height:1.3;
}

.inline-skill-rate-row{
    align-content:center;
}

@media(max-width:800px){
    .company-rate-card-grid{
        grid-template-columns:1fr;
    }
}


/* ==========================================================
   Flooring Skills & Rates compact box layout v4
   ========================================================== */

.inline-skill-rate-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

.inline-skill-rate-row{
    gap:10px !important;
    border:1px solid rgba(255,255,255,.13) !important;
    border-radius:11px !important;
    background:rgba(255,255,255,.025) !important;
}

.inline-skill-rate-row.selected{
    border-color:rgba(201,164,92,.42) !important;
    background:rgba(201,164,92,.055) !important;
}

.inline-skill-check{
    min-width:0;
}

.inline-skill-check span{
    line-height:1.25;
}

.inline-rate-entry{
    display:flex !important;
    align-items:center !important;
}

.inline-rate-basis{
    text-align:left;
}

/* Give "Other flooring skill" some breathing room. */
.inline-skill-rate-grid + .full,
.inline-skill-rate-grid ~ .full{
    margin-top:0;
}

/* The specific Other flooring skill block immediately following
   the skills section gets a deliberate top gap. */
.inline-skill-rate-grid + div,
.inline-skill-rate-grid + .field{
    margin-top:18px;
}

@media(max-width:1100px){
    .inline-skill-rate-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}

@media(max-width:700px){
    .inline-skill-rate-grid{
        grid-template-columns:1fr !important;
    }
}


#other_flooring_skill{
    margin-top:2px;
}

#other_flooring_skill{
    scroll-margin-top:20px;
}

label[for="other_flooring_skill"]{
    display:block;
}

/* Automatic currency display v1 */
.auto-currency-display{
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:46px;
    padding:10px 12px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:9px;
    background:rgba(255,255,255,.025);
}

.auto-currency-display strong{
    color:#fff;
    font-size:14px;
}

.auto-currency-display span{
    margin-top:3px;
    color:#90a9ba;
    font-size:10px;
    line-height:1.3;
}


/* Entrance Matting "per mat" label needs slightly more breathing room. */

.company-rate-basis{
    min-width:34px;
}


/* ==========================================================
   New Requirement mobile compact layout v7
   ========================================================== */

/* Rate entry is visually unnecessary until the skill is selected. */
.inline-skill-rate-row:not(.selected) .inline-rate-entry{
    display:none !important;
}

.inline-skill-rate-row:not(.selected){
    grid-template-columns:1fr !important;
}

.inline-skill-rate-row.selected{
    grid-template-columns:minmax(0,1fr) auto !important;
}

/* Keep unselected skill boxes short. */
.inline-skill-rate-row:not(.selected){
    min-height:48px !important;
    padding-top:8px !important;
    padding-bottom:8px !important;
}

/* Selected boxes can grow only as much as needed. */
.inline-skill-rate-row.selected{
    min-height:58px !important;
}

/* Less dead space around the skill section. */
.inline-skill-rate-grid{
    gap:8px !important;
}

/* Give Other flooring skill a clear, intentional break. */
label[for="other_flooring_skill"]{
    margin-top:26px !important;
}

#other_flooring_skill{
    margin-bottom:4px;
}

@media(max-width:700px){

    /* Keep the address pairs compact instead of making every field full width. */
    .form-grid{
        gap:12px !important;
    }

    /* The skill selector remains two columns on normal phones. */
    .inline-skill-rate-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:7px !important;
    }

    .inline-skill-rate-row{
        min-height:46px !important;
        padding:8px 9px !important;
        border-radius:9px !important;
    }

    .inline-skill-check{
        gap:7px !important;
        font-size:12px !important;
        line-height:1.15 !important;
    }

    .inline-skill-check input{
        width:16px !important;
        height:16px !important;
    }

    /* Selected skill expands cleanly to show its rate. */
    .inline-skill-rate-row.selected{
        grid-template-columns:1fr !important;
        gap:7px !important;
        align-items:start !important;
    }

    .inline-skill-rate-row.selected .inline-rate-entry{
        justify-content:flex-start !important;
        padding-left:23px;
    }

    .inline-rate-input{
        width:70px !important;
        min-width:70px !important;
        height:34px !important;
        padding:6px 7px !important;
    }

    .inline-rate-basis{
        font-size:11px !important;
    }

    /* Work environment cards become smaller on mobile. */
    .skill-picker{
        gap:7px !important;
    }

    .skill-check{
        min-height:auto !important;
        padding:9px 10px !important;
    }

    .skill-check strong{
        font-size:12px !important;
    }

    .skill-check .small{
        font-size:10px !important;
        line-height:1.25 !important;
    }

    /* Project summary stays useful but doesn't dominate the first screen. */
    .project-summary-textarea{
        min-height:92px !important;
        height:92px;
    }

    /* Tighten section rhythm without making it cramped. */
    .divider{
        margin-top:14px !important;
        margin-bottom:14px !important;
    }

    .section-title{
        margin-bottom:7px !important;
    }

    .help,
    .small{
        line-height:1.35;
    }

    /* Action buttons stay side-by-side when possible. */
    .actions{
        gap:8px !important;
    }
}

@media(max-width:390px){
    /* On very narrow phones, long trade names need a little more room. */
    .inline-skill-rate-grid{
        grid-template-columns:1fr 1fr !important;
    }

    .inline-skill-check{
        font-size:11px !important;
    }
}


/* ==========================================================
   Restore visible rates in compact skill boxes v8
   ========================================================== */

/* Always show the rate field. */
.inline-skill-rate-row .inline-rate-entry,
.inline-skill-rate-row:not(.selected) .inline-rate-entry{
    display:flex !important;
}

/* Keep every skill box compact with skill + rate side by side. */
.inline-skill-rate-row,
.inline-skill-rate-row:not(.selected),
.inline-skill-rate-row.selected{
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:center !important;
    min-height:52px !important;
    gap:8px !important;
}

/* Keep rate controls small enough for compact cards. */
.inline-rate-input{
    width:62px !important;
    min-width:62px !important;
    height:34px !important;
    padding:6px 7px !important;
    text-align:right !important;
}

.inline-rate-entry{
    padding-left:0 !important;
    justify-content:flex-end !important;
    gap:4px !important;
}

.inline-rate-basis{
    font-size:10px !important;
    min-width:auto !important;
}

/* On phones keep two-column skill layout, but don't hide prices. */
@media(max-width:700px){
    .inline-skill-rate-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

    .inline-skill-rate-row,
    .inline-skill-rate-row:not(.selected),
    .inline-skill-rate-row.selected{
        grid-template-columns:minmax(0,1fr) auto !important;
        min-height:50px !important;
        padding:7px 8px !important;
    }

    .inline-skill-check{
        font-size:11px !important;
        line-height:1.1 !important;
    }

    .inline-rate-input{
        width:56px !important;
        min-width:56px !important;
        height:32px !important;
        padding:5px 6px !important;
        font-size:11px !important;
    }

    .inline-rate-basis{
        font-size:9px !important;
    }
}

@media(max-width:390px){
    .inline-rate-input{
        width:52px !important;
        min-width:52px !important;
    }
}


/* ==========================================================
   New Requirement tighter layout v9
   ========================================================== */

form.card{
    padding:22px !important;
}

form.card > .grid{
    gap:11px !important;
}

form.card .divider{
    margin:11px 0 !important;
}

form.card .section-title{
    margin:0 0 5px !important;
    font-size:16px !important;
}

form.card label.field{
    margin-bottom:4px !important;
    font-size:13px !important;
}

form.card input,
form.card select,
form.card textarea{
    padding:10px 11px !important;
}

form.card .help{
    margin-top:3px !important;
    font-size:11px !important;
    line-height:1.3 !important;
}

form.card .small{
    font-size:11px !important;
    line-height:1.3 !important;
}

form.card p.small{
    margin-bottom:6px !important;
}

form.card .skill-picker{
    gap:7px !important;
}

form.card .skill-check{
    min-height:40px !important;
    padding:7px 9px !important;
}

form.card .inline-skill-rate-grid{
    gap:7px !important;
}

form.card .inline-skill-rate-row,
form.card .inline-skill-rate-row:not(.selected),
form.card .inline-skill-rate-row.selected{
    min-height:47px !important;
    padding:7px 9px !important;
}

form.card label[for="other_flooring_skill"]{
    margin-top:9px !important;
}

form.card .auto-currency-display{
    min-height:40px !important;
    padding:7px 9px !important;
}

form.card .auto-currency-display span{
    margin-top:1px !important;
}

form.card .project-summary-textarea{
    min-height:105px !important;
    height:105px;
}

form.card .checks{
    gap:7px !important;
}

form.card .check{
    gap:8px !important;
    line-height:1.3 !important;
}

form.card .actions{
    margin-top:14px !important;
    gap:8px !important;
}

form.card .button{
    padding:11px 15px !important;
}

@media(max-width:700px){
    form.card{
        padding:15px !important;
        border-radius:14px !important;
    }

    form.card > .grid{
        gap:8px !important;
    }

    form.card .divider{
        margin:8px 0 !important;
    }

    form.card .section-title{
        margin-bottom:4px !important;
        font-size:15px !important;
    }

    form.card input,
    form.card select,
    form.card textarea{
        padding:8px 9px !important;
    }

    form.card .project-summary-textarea{
        min-height:78px !important;
        height:78px !important;
    }

    form.card label[for="other_flooring_skill"]{
        margin-top:6px !important;
    }

    form.card .skill-check{
        padding:6px 7px !important;
    }

    form.card .inline-skill-rate-row,
    form.card .inline-skill-rate-row:not(.selected),
    form.card .inline-skill-rate-row.selected{
        min-height:44px !important;
        padding:6px 7px !important;
    }

    form.card .actions{
        margin-top:10px !important;
    }
}


/* ==========================================================
   Wide desktop requirement layout v10
   ========================================================== */

.topbar-inner{
    max-width:1480px;
}

.requirement-page{
    max-width:1480px;
    padding-top:42px;
}

.requirement-heading{
    max-width:900px;
    margin-bottom:22px;
}

.requirement-heading .lead{
    margin-bottom:0;
    max-width:850px;
}

.requirement-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 360px;
    gap:24px;
    align-items:start;
}

.requirement-main{
    min-width:0;
}

.requirement-form-card{
    width:100%;
    max-width:none;
}

.requirement-sidebar{
    min-width:0;
}

.requirement-sidebar-sticky{
    position:sticky;
    top:24px;
    display:grid;
    gap:14px;
}

.summary-card{
    background:rgba(16,40,59,.9);
    border:1px solid var(--line);
    border-radius:16px;
    padding:18px;
    box-shadow:0 18px 42px rgba(0,0,0,.16);
}

.summary-card h2,
.summary-card h3{
    margin:0;
}

.summary-card h2{
    font-size:20px;
}

.summary-card h3{
    font-size:16px;
}

.summary-card-heading p{
    margin:5px 0 0;
    color:var(--muted);
    font-size:12px;
    line-height:1.4;
}

.requirement-summary-list{
    margin:16px 0 0;
}

.requirement-summary-list > div{
    display:grid;
    grid-template-columns:1fr 1.25fr;
    gap:12px;
    padding:9px 0;
    border-bottom:1px solid rgba(255,255,255,.09);
}

.requirement-summary-list > div:last-child{
    border-bottom:0;
}

.requirement-summary-list dt{
    color:#e7eef2;
    font-size:12px;
    font-weight:800;
}

.requirement-summary-list dd{
    margin:0;
    color:var(--muted);
    font-size:12px;
    text-align:right;
    overflow-wrap:anywhere;
}

.summary-skills-block{
    margin-top:14px;
    padding-top:14px;
    border-top:1px solid rgba(255,255,255,.11);
}

.summary-subheading{
    margin-bottom:9px;
    color:#fff;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.06em;
}

.summary-skill-list{
    display:grid;
    gap:7px;
}

.summary-skill-item{
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:7px 9px;
    border-radius:8px;
    background:rgba(255,255,255,.035);
    font-size:11px;
}

.summary-skill-item span{
    color:#dce6eb;
}

.summary-skill-item strong{
    color:#fff;
    text-align:right;
    white-space:nowrap;
}

.summary-empty{
    color:var(--muted);
    font-size:11px;
}

.posting-company{
    display:grid;
    gap:5px;
}

.posting-company strong{
    color:#fff;
}

.posting-company span{
    color:var(--muted);
    font-size:11px;
    line-height:1.35;
}

.requirement-help-card ul{
    margin:10px 0 0;
    padding-left:19px;
    color:#c9d6de;
    font-size:11px;
    line-height:1.55;
}

.requirement-help-card li + li{
    margin-top:4px;
}

.requirement-sidebar-actions{
    display:grid;
    gap:9px;
}

.requirement-sidebar-actions .button{
    width:100%;
    text-align:center;
}

.requirement-post-button{
    padding-top:14px;
    padding-bottom:14px;
}

.requirement-cancel-button{
    background:#102d42;
}

.requirement-privacy-note{
    margin:14px 0 0;
    padding-top:13px;
    border-top:1px solid rgba(255,255,255,.09);
}

@media(min-width:1180px){
    .requirement-form-card .grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:1160px){
    .requirement-page{
        max-width:980px;
    }

    .requirement-layout{
        grid-template-columns:1fr;
    }

    .requirement-sidebar-sticky{
        position:static;
    }

    .requirement-sidebar{
        order:2;
    }

    .requirement-sidebar-actions{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:720px){
    .requirement-page{
        padding-top:30px;
    }

    .requirement-heading{
        margin-bottom:16px;
    }

    .requirement-layout{
        gap:14px;
    }

    .summary-card{
        padding:15px;
    }

    .requirement-summary-list > div{
        grid-template-columns:1fr;
        gap:3px;
    }

    .requirement-summary-list dd{
        text-align:left;
    }

    .requirement-sidebar-actions{
        grid-template-columns:1fr;
    }
}


/* ==========================================================
   Required start date visibility v12
   ========================================================== */

#start_date{
    width:290px !important;
    max-width:100% !important;
    color-scheme:dark;
}

/* Make the calendar icon obvious on dark backgrounds. */
#start_date::-webkit-calendar-picker-indicator{
    opacity:1 !important;
    filter:invert(1) brightness(2) !important;
    cursor:pointer;
    width:18px;
    height:18px;
}

/* Firefox / other browsers keep the field readable. */
#start_date{
    accent-color:#fff;
}

@media(max-width:700px){
    #start_date{
        width:100% !important;
    }
}


/* ==========================================================
   Compact start date + white calendar button v13
   ========================================================== */

.start-date-control{
    grid-template-columns:minmax(0,250px) 42px;
    gap:8px;
    align-items:stretch;
}

.start-date-control #start_date{
    min-width:0 !important;
    max-width:none !important;
}

/* Hide the browser's dark native icon.
   The input remains a real date input. */

.start-date-picker{
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:
        border-color .18s ease,
        background .18s ease,
        transform .18s ease;
}

.start-date-picker:hover{
    border-color:rgba(255,255,255,.5);
}

.start-date-picker:focus-visible{
    outline:2px solid #fff;
    outline-offset:2px;
}

.start-date-picker svg{
    fill:none;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

@media(max-width:700px){
    .start-date-control{
        grid-template-columns:minmax(0,1fr) 42px;
        width:100%;
    }
}


/* ==========================================================
   Calendar icon inside date field v14
   ========================================================== */

.start-date-control{
    position:relative !important;
    display:block !important;
    width:300px !important;
    max-width:100% !important;
}

.start-date-control #start_date{
    width:100% !important;
    box-sizing:border-box !important;
    padding-right:46px !important;
}

/* Place the working calendar button inside the input field. */
.start-date-picker{
    position:absolute !important;
    top:50% !important;
    right:7px !important;
    transform:translateY(-50%) !important;

    width:34px !important;
    min-width:34px !important;
    height:34px !important;

    padding:0 !important;
    border:0 !important;
    border-radius:7px !important;

    background:transparent !important;
    color:#fff !important;

    z-index:3;
}

.start-date-picker:hover{
    transform:translateY(-50%) !important;
    background:rgba(255,255,255,.08) !important;
    border:0 !important;
}

.start-date-picker svg{
    width:19px !important;
    height:19px !important;
    stroke:#fff !important;
    opacity:1 !important;
}

/* Keep the native dark icon hidden so only our white icon appears. */
.start-date-control #start_date::-webkit-calendar-picker-indicator{
    opacity:0 !important;
    pointer-events:none !important;
    width:0 !important;
    height:0 !important;
    margin:0 !important;
    padding:0 !important;
}

@media(max-width:700px){
    .start-date-control{
        width:100% !important;
    }
}


/* ==========================================================
   Reliable native calendar with white overlay icon v16
   ========================================================== */

.native-date-control{
    position:relative;
    width:300px;
    max-width:100%;
}

.native-date-control #start_date{
    display:block;
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    padding-right:48px !important;
    color-scheme:dark;
    cursor:pointer;
}

/*
   Keep Chrome's REAL calendar indicator alive and clickable,
   but make the browser's black artwork invisible.
*/
.native-date-control #start_date::-webkit-calendar-picker-indicator{
    position:absolute;
    top:0;
    right:0;
    width:44px !important;
    height:100% !important;
    margin:0 !important;
    padding:0 !important;
    opacity:0 !important;
    cursor:pointer !important;
    z-index:4;
}

/*
   Our white icon is visual only.
   pointer-events:none means every click goes THROUGH it to
   the genuine browser calendar control underneath.
*/
.native-date-white-icon{
    position:absolute;
    top:50%;
    right:12px;
    transform:translateY(-50%);
    display:flex;
    align-items:center;
    justify-content:center;
    width:22px;
    height:22px;
    color:#fff;
    pointer-events:none;
    z-index:3;
}

.native-date-white-icon svg{
    width:20px;
    height:20px;
    fill:none;
    stroke:#fff;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

/* Remove the old custom/button date controls if cached CSS is still around. */
.start-date-picker,
.start-date-calendar{
    display:none !important;
}

@media(max-width:700px){
    .native-date-control{
        width:100%;
    }
}


/* ==========================================================
   New Requirement final polish v17
   ========================================================== */

.other-skill-rate-row{
    display:grid;
    grid-template-columns:1fr;
    align-items:center;
    gap:8px;
    min-height:47px;
    padding:7px 9px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:11px;
    background:rgba(255,255,255,.025);
}

.other-skill-rate-row.selected{
    border-color:rgba(201,164,92,.42);
    background:rgba(201,164,92,.055);
}

.other-skill-fields{
    padding-top:7px;
    border-top:1px solid rgba(255,255,255,.08);
}

/* Additional rate information + Payment terms now align as a pair. */
#rate_details,
#payment_terms{
    width:100%;
}

/* Project summary is still roomy, just not dominant. */
.project-summary-textarea{
    min-height:88px !important;
    height:88px !important;
}

@media(max-width:700px){
    .other-skill-fields{
        grid-template-columns:1fr;
    }

    .other-skill-fields .inline-rate-entry{
        padding-left:0 !important;
        justify-content:flex-start !important;
    }

    .project-summary-textarea{
        min-height:70px !important;
        height:70px !important;
    }
}


/* ==========================================================
   Final skill-row tidy-up v18
   Plywood stays one normal tile.
   Other uses the remaining two columns.
   ========================================================== */

@media(min-width:901px){

    .other-skill-rate-row{
        grid-column:span 2 !important;
        grid-template-columns:auto minmax(0,1fr) !important;
        align-items:center !important;
        min-height:47px !important;
        padding:7px 9px !important;
    }

    .other-skill-rate-row:not(.selected){
        grid-template-columns:1fr !important;
    }

    .other-skill-rate-row.selected{
        grid-template-columns:auto minmax(0,1fr) !important;
    }

    .other-skill-rate-row .inline-skill-check{
        min-width:74px;
        margin:0 !important;
    }

    .other-skill-fields{
        grid-column:auto !important;
        display:grid !important;
        grid-template-columns:minmax(180px,1fr) auto !important;
        align-items:center !important;
        gap:8px !important;

        margin:0 !important;
        padding:0 !important;
        border-top:0 !important;
    }

    .other-skill-fields[hidden]{
        display:none !important;
    }

    .other-skill-name{
        height:34px !important;
        padding:6px 8px !important;
    }

    .other-skill-fields .inline-rate-entry{
        padding:0 !important;
        margin:0 !important;
        justify-content:flex-end !important;
    }

    /* Keep all ordinary skill tiles visually identical in height. */
    .inline-skill-rate-row{
        min-height:47px !important;
        height:47px !important;
        box-sizing:border-box !important;
    }

    .other-skill-rate-row{
        height:47px !important;
        box-sizing:border-box !important;
    }
}

/* Tablet/mobile: Other returns to a normal full-width responsive card. */
@media(max-width:900px){
    .other-skill-rate-row{
        grid-column:auto !important;
    }
}


/* ==========================================================
   Other skill tile final inline layout v19
   ========================================================== */

@media(min-width:901px){

    .other-skill-rate-row,
    .other-skill-rate-row.selected,
    .other-skill-rate-row:not(.selected){
        grid-column:span 2 !important;
        display:flex !important;
        align-items:center !important;
        gap:10px !important;

        min-height:47px !important;
        height:47px !important;

        padding:7px 9px !important;
        box-sizing:border-box !important;
    }

    .other-skill-rate-row .inline-skill-check{
        flex:0 0 auto !important;
        min-width:70px !important;
        margin:0 !important;
    }

    .other-skill-fields{
        flex:1 1 auto !important;
        min-width:0 !important;

        display:flex !important;
        align-items:center !important;
        gap:8px !important;

        margin:0 !important;
        padding:0 !important;
        border:0 !important;
    }

    .other-skill-fields[hidden]{
        display:none !important;
    }

    .other-skill-name{
        flex:1 1 auto !important;
        min-width:160px !important;
        height:32px !important;
        margin:0 !important;
        padding:5px 8px !important;
        box-sizing:border-box !important;
    }

    .other-skill-fields .inline-rate-entry{
        flex:0 0 auto !important;
        display:flex !important;
        align-items:center !important;
        gap:4px !important;

        margin:0 !important;
        padding:0 !important;
    }

    .other-skill-fields .inline-rate-input{
        width:58px !important;
        min-width:58px !important;
        height:32px !important;
        margin:0 !important;
        padding:5px 6px !important;
    }

    .other-skill-fields .inline-rate-basis{
        white-space:nowrap !important;
    }

    /* All ordinary skill cards stay identical. */
    .inline-skill-rate-row{
        height:47px !important;
        min-height:47px !important;
        box-sizing:border-box !important;
    }
}

/* Keep responsive behavior sensible below desktop width. */
@media(max-width:900px){
    .other-skill-rate-row{
        grid-column:auto !important;
        display:grid !important;
    }

    .other-skill-fields{
        display:grid !important;
    }

    .other-skill-fields[hidden]{
        display:none !important;
    }
}


/* ==========================================================
   Wide Company Profile layout v1
   ========================================================== */

.company-profile-page{
    max-width:1480px !important;
    padding-top:42px;
}

.company-profile-page > .lead{
    max-width:880px;
}

.company-profile-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 540px;
    gap:24px;
    align-items:start;
}

.company-details-card{
    min-width:0;
    margin:0;
}

.company-rate-column{
    min-width:0;
}

.company-rate-panel{
    position:sticky;
    top:24px;
    margin:0;
    padding:24px;
}

.company-rate-panel-heading{
    margin-bottom:16px;
    padding-bottom:14px;
    border-bottom:1px solid rgba(255,255,255,.10);
}

.company-rate-panel-heading .section-title{
    margin-bottom:5px;
}

.company-rate-currency{
    max-width:260px;
    margin-bottom:14px;
}

.company-rate-card-body{
    min-width:0;
}

.company-profile-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
    margin-top:18px !important;
    padding-top:16px;
    border-top:1px solid rgba(255,255,255,.10);
}

.company-profile-actions .button{
    width:100%;
    text-align:center;
}

.company-details-card .grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
}

/* Avoid absurdly wide single fields on a large monitor. */
.company-details-card #contact_phone{
    max-width:360px;
}

.company-details-card #website{
    max-width:680px;
}

.company-details-card #company_name{
    max-width:680px;
}

/* The three-question note should align with the new wide composition. */
.company-profile-page > .message.info{
    max-width:900px;
}

@media(max-width:1180px){
    .company-profile-page{
        max-width:980px !important;
    }

    .company-profile-layout{
        grid-template-columns:1fr;
    }

    .company-rate-panel{
        position:static;
    }

    .company-rate-panel .company-rate-card-grid{
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    }
}

@media(max-width:800px){
    .company-profile-page{
        padding-top:30px;
    }

    .company-details-card .grid{
        grid-template-columns:1fr;
    }

    .company-rate-panel .company-rate-card-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

    .company-profile-actions{
        grid-template-columns:1fr;
    }
}

@media(max-width:520px){
    .company-rate-panel .company-rate-card-grid{
        grid-template-columns:1fr !important;
    }
}


/* ==========================================================
   Company Profile tidy v2
   ========================================================== */

.compact-rate-currency{
    margin:0 0 14px;
    padding:9px 11px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:9px;
    background:rgba(255,255,255,.025);
    color:#9eb3c1;
    font-size:11px;
    line-height:1.35;
}

.compact-rate-currency strong{
    color:#fff;
}

.company-rate-panel .company-rate-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
}

.company-rate-panel .company-rate-row{
    min-height:58px !important;
    padding:10px 11px !important;
}

.company-rate-panel .company-rate-name{
    font-size:12px !important;
}

.company-rate-panel .company-rate-input{
    padding:7px 8px !important;
    text-align:right !important;
}

.company-rate-panel .company-rate-symbol,
.company-rate-panel .company-rate-basis{
    font-size:10px !important;
}

@media(max-width:1180px){
    .company-rate-panel .company-rate-card-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}

@media(max-width:620px){
    .company-rate-panel .company-rate-card-grid{
        grid-template-columns:1fr !important;
    }
}


/* ==========================================================
   Company Rate Card overlap fix v3
   ========================================================== */

/* Give the Rate Card a little more desktop breathing room. */
@media(min-width:1181px){
    .company-profile-layout{
        grid-template-columns:minmax(0,1fr) 620px !important;
    }
}

/* Keep each tile fully self-contained. */
.company-rate-panel .company-rate-row{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 118px !important;
    align-items:center !important;
    gap:8px !important;

    min-width:0 !important;
    overflow:hidden !important;
}

/* Skill names may wrap, but never push into the next tile. */
.company-rate-panel .company-rate-name{
    min-width:0 !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
    line-height:1.15 !important;
}

/* Treat £ + input + basis as one fixed unit. */
.company-rate-panel .company-rate-entry{
    display:grid !important;
    grid-template-columns:auto 72px auto !important;
    align-items:center !important;
    justify-content:end !important;
    gap:4px !important;

    width:118px !important;
    min-width:118px !important;
    max-width:118px !important;
}

.company-rate-panel .company-rate-symbol,
.company-rate-panel .company-rate-basis{
    display:block !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    white-space:nowrap !important;
}

.company-rate-panel .company-rate-input{
    width:72px !important;
    min-width:72px !important;
    max-width:72px !important;
    box-sizing:border-box !important;
    margin:0 !important;
}

/* Entrance matting and stair-nosings labels need slightly longer basis text. */
.company-rate-panel .company-rate-basis{
    font-size:9px !important;
}

/* On medium screens, keep two columns only while there is room. */
@media(max-width:1180px) and (min-width:721px){
    .company-rate-panel .company-rate-card-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

    .company-rate-panel .company-rate-row{
        grid-template-columns:minmax(0,1fr) 112px !important;
    }

    .company-rate-panel .company-rate-entry{
        width:112px !important;
        min-width:112px !important;
        max-width:112px !important;
        grid-template-columns:auto 68px auto !important;
    }

    .company-rate-panel .company-rate-input{
        width:68px !important;
        min-width:68px !important;
        max-width:68px !important;
    }
}

/* On small screens, one rate tile per row is cleaner. */
@media(max-width:720px){
    .company-rate-panel .company-rate-card-grid{
        grid-template-columns:1fr !important;
    }
}


/* ==========================================================
   Requirement county + skill-card alignment v21
   ========================================================== */

/* All standard flooring skill tiles use the same internal geometry. */
.inline-skill-rate-grid{
    align-items:stretch !important;
}

.inline-skill-rate-row{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 96px !important;
    grid-template-rows:minmax(36px,1fr) auto !important;
    column-gap:8px !important;
    row-gap:3px !important;

    min-height:68px !important;
    height:68px !important;
    padding:7px 9px !important;

    align-items:center !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
}

.inline-skill-rate-row .inline-skill-check{
    grid-column:1 !important;
    grid-row:1 !important;

    min-width:0 !important;
    margin:0 !important;

    align-self:center !important;
}

.inline-skill-rate-row .inline-skill-check span{
    min-width:0 !important;
    line-height:1.12 !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
}

.inline-skill-rate-row .inline-rate-entry{
    grid-column:2 !important;
    grid-row:1 !important;

    width:96px !important;
    min-width:96px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:4px !important;

    margin:0 !important;
    padding:0 !important;
}

.inline-skill-rate-row .inline-rate-input{
    width:62px !important;
    min-width:62px !important;
    max-width:62px !important;
    height:34px !important;
    box-sizing:border-box !important;
}

.inline-skill-rate-row .inline-rate-basis{
    flex:0 0 auto !important;
    min-width:24px !important;
    text-align:left !important;
    white-space:nowrap !important;
    font-size:9px !important;
}

/* Saved default always occupies the same bottom line. */
.inline-skill-rate-row .saved-default-rate{
    grid-column:1 / -1 !important;
    grid-row:2 !important;

    margin:0 !important;
    padding:0 !important;

    min-height:13px !important;
    line-height:13px !important;
    font-size:9px !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
}

/* If no default exists, retain the same card geometry. */
.inline-skill-rate-row:not(:has(.saved-default-rate)){
    grid-template-rows:minmax(36px,1fr) 13px !important;
}

/* Keep the wide Other tile aligned to the same 68px row height. */
@media(min-width:901px){
    .other-skill-rate-row,
    .other-skill-rate-row.selected,
    .other-skill-rate-row:not(.selected){
        height:68px !important;
        min-height:68px !important;
        box-sizing:border-box !important;
    }
}

/* Medium/mobile layouts remain responsive rather than forcing desktop widths. */
@media(max-width:900px){
    .inline-skill-rate-row{
        height:auto !important;
        min-height:58px !important;
    }

    .inline-skill-rate-row .inline-rate-entry{
        width:auto !important;
        min-width:0 !important;
    }
}


/* ==========================================================
   Requirement final 15-tile grid v22
   ========================================================== */

/* Other is now the 15th tile, occupying the final grid position. */
.other-skill-rate-row,
.other-skill-rate-row.selected,
.other-skill-rate-row:not(.selected){
    grid-column:auto !important;

    display:grid !important;
    grid-template-columns:auto minmax(0,1fr) 96px !important;
    grid-template-rows:minmax(36px,1fr) 13px !important;

    column-gap:7px !important;
    row-gap:3px !important;

    min-height:68px !important;
    height:68px !important;

    padding:7px 9px !important;

    align-items:center !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
}

.other-skill-rate-row .inline-skill-check{
    grid-column:1 !important;
    grid-row:1 !important;

    min-width:0 !important;
    margin:0 !important;
}

.other-skill-fields{
    grid-column:2 / 4 !important;
    grid-row:1 !important;

    display:grid !important;
    grid-template-columns:minmax(72px,1fr) 96px !important;

    gap:6px !important;
    align-items:center !important;

    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
}

.other-skill-fields[hidden]{
    display:grid !important;
}

.other-skill-name{
    width:100% !important;
    min-width:0 !important;
    height:34px !important;

    margin:0 !important;
    padding:6px 7px !important;

    box-sizing:border-box !important;
}

.other-skill-fields .inline-rate-entry{
    width:96px !important;
    min-width:96px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;

    gap:4px !important;
    margin:0 !important;
    padding:0 !important;
}

.other-skill-fields .inline-rate-input{
    width:62px !important;
    min-width:62px !important;
    max-width:62px !important;
    height:34px !important;

    margin:0 !important;
    padding:6px 7px !important;

    box-sizing:border-box !important;
}

.other-skill-fields .inline-rate-basis{
    min-width:24px !important;
    font-size:9px !important;
    white-space:nowrap !important;
}

/* Keep disabled Other fields visible but subtly muted. */
.other-skill-rate-row:not(.selected) .other-skill-name,
.other-skill-rate-row:not(.selected) .inline-rate-input{
    opacity:.55 !important;
}

/* Standard + Other tiles now share identical desktop geometry. */
.inline-skill-rate-row,
.other-skill-rate-row{
    border-radius:11px !important;
}

/* Saved-default line remains consistent in every normal tile. */
.saved-default-rate{
    font-variant-numeric:tabular-nums;
}

/* Mobile: Other can stack internally rather than becoming cramped. */
@media(max-width:900px){
    .other-skill-rate-row,
    .other-skill-rate-row.selected,
    .other-skill-rate-row:not(.selected){
        height:auto !important;
        min-height:58px !important;
        grid-template-columns:1fr !important;
        grid-template-rows:auto auto !important;
    }

    .other-skill-rate-row .inline-skill-check{
        grid-column:1 !important;
        grid-row:1 !important;
    }

    .other-skill-fields{
        grid-column:1 !important;
        grid-row:2 !important;
        grid-template-columns:minmax(0,1fr) auto !important;
        padding-left:23px !important;
    }
}


/* ==========================================================
   Requirement price-column alignment v23
   ========================================================== */

/*
   Every normal skill tile now has a fixed rate column.
   Long skill names can wrap on the left without moving the price.
*/
@media(min-width:901px){

    .inline-skill-rate-row{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) 122px !important;
        grid-template-rows:44px 14px !important;

        column-gap:10px !important;
        row-gap:2px !important;

        height:72px !important;
        min-height:72px !important;

        padding:7px 10px !important;
        box-sizing:border-box !important;

        align-items:center !important;
        overflow:hidden !important;
    }

    .inline-skill-rate-row .inline-skill-check{
        grid-column:1 !important;
        grid-row:1 !important;

        display:grid !important;
        grid-template-columns:18px minmax(0,1fr) !important;
        gap:8px !important;

        min-width:0 !important;
        width:100% !important;

        margin:0 !important;
        padding:0 !important;

        align-items:center !important;
    }

    .inline-skill-rate-row .inline-skill-check input{
        width:15px !important;
        height:15px !important;
        margin:0 !important;
    }

    .inline-skill-rate-row .inline-skill-check span{
        min-width:0 !important;

        line-height:1.12 !important;
        font-size:13px !important;
        font-weight:800 !important;

        white-space:normal !important;
        overflow-wrap:normal !important;
        word-break:normal !important;
    }

    /*
       Rate control is a fixed 122px wide unit:
       [ 72px price ] [ 46px basis ]
    */
    .inline-skill-rate-row .inline-rate-entry{
        grid-column:2 !important;
        grid-row:1 !important;

        display:grid !important;
        grid-template-columns:72px 46px !important;

        width:122px !important;
        min-width:122px !important;
        max-width:122px !important;

        gap:4px !important;
        align-items:center !important;
        justify-content:end !important;

        margin:0 !important;
        padding:0 !important;
    }

    .inline-skill-rate-row .inline-rate-input{
        width:72px !important;
        min-width:72px !important;
        max-width:72px !important;

        height:36px !important;

        margin:0 !important;
        padding:6px 8px !important;

        box-sizing:border-box !important;
        text-align:right !important;

        font-variant-numeric:tabular-nums !important;
    }

    .inline-skill-rate-row .inline-rate-basis{
        width:46px !important;
        min-width:46px !important;
        max-width:46px !important;

        margin:0 !important;
        padding:0 !important;

        text-align:left !important;
        white-space:nowrap !important;

        font-size:9px !important;
        line-height:1 !important;
    }

    /*
       Saved default is pinned to the same bottom line on every card.
    */
    .inline-skill-rate-row .saved-default-rate{
        grid-column:1 / -1 !important;
        grid-row:2 !important;

        display:block !important;

        min-height:14px !important;
        height:14px !important;

        margin:0 !important;
        padding:0 !important;

        line-height:14px !important;
        font-size:9px !important;

        white-space:nowrap !important;
        overflow:hidden !important;
        text-overflow:ellipsis !important;

        font-variant-numeric:tabular-nums !important;
    }


    /* ======================================================
       Other tile
       Same height, with fixed zones for name and rate.
       ====================================================== */

    .other-skill-rate-row,
    .other-skill-rate-row.selected,
    .other-skill-rate-row:not(.selected){
        display:grid !important;
        grid-template-columns:72px minmax(80px,1fr) 122px !important;
        grid-template-rows:1fr !important;

        gap:7px !important;

        height:72px !important;
        min-height:72px !important;

        padding:7px 10px !important;
        box-sizing:border-box !important;

        align-items:center !important;
        overflow:hidden !important;
    }

    .other-skill-rate-row .inline-skill-check{
        grid-column:1 !important;
        grid-row:1 !important;

        display:grid !important;
        grid-template-columns:15px auto !important;
        gap:7px !important;

        min-width:0 !important;
        margin:0 !important;
        padding:0 !important;

        align-items:center !important;
    }

    .other-skill-rate-row .inline-skill-check input{
        width:15px !important;
        height:15px !important;
        margin:0 !important;
    }

    .other-skill-fields,
    .other-skill-fields[hidden]{
        grid-column:2 / 4 !important;
        grid-row:1 !important;

        display:grid !important;
        grid-template-columns:minmax(80px,1fr) 122px !important;

        gap:7px !important;
        align-items:center !important;

        min-width:0 !important;

        margin:0 !important;
        padding:0 !important;
        border:0 !important;
    }

    .other-skill-name{
        width:100% !important;
        min-width:0 !important;
        height:36px !important;

        margin:0 !important;
        padding:6px 8px !important;

        box-sizing:border-box !important;
    }

    .other-skill-fields .inline-rate-entry{
        display:grid !important;
        grid-template-columns:72px 46px !important;

        width:122px !important;
        min-width:122px !important;
        max-width:122px !important;

        gap:4px !important;

        margin:0 !important;
        padding:0 !important;

        align-items:center !important;
    }

    .other-skill-fields .inline-rate-input{
        width:72px !important;
        min-width:72px !important;
        max-width:72px !important;

        height:36px !important;

        margin:0 !important;
        padding:6px 8px !important;

        box-sizing:border-box !important;
        text-align:right !important;
    }

    .other-skill-fields .inline-rate-basis{
        width:46px !important;
        min-width:46px !important;
        max-width:46px !important;

        margin:0 !important;
        padding:0 !important;

        white-space:nowrap !important;
        font-size:9px !important;
    }
}


/* Tablet/mobile remains flexible. */
@media(max-width:900px){

    .inline-skill-rate-row{
        height:auto !important;
        min-height:60px !important;
    }

    .other-skill-rate-row,
    .other-skill-rate-row.selected,
    .other-skill-rate-row:not(.selected){
        height:auto !important;
        min-height:60px !important;
    }
}


/* ==========================================================
   Missing project controls restored compactly v25
   ========================================================== */

.compact-job-details{
    display:grid;
    grid-template-columns:180px 190px minmax(240px,1fr);
    gap:12px;
    align-items:end;
    margin-top:10px;
}

.compact-job-details > div{
    min-width:0;
}

.compact-job-details input,
.compact-job-details select{
    width:100% !important;
}

.compact-practical-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    border:1px solid rgba(255,255,255,.10);
    border-radius:10px;
    background:rgba(255,255,255,.022);
}

.compact-practical-label{
    color:#fff;
}

.compact-practical-row .check{
    display:flex;
    align-items:center;
    margin:0;
    white-space:nowrap;
}

.compact-practical-row .check input{
    width:auto !important;
    margin:0 !important;
}

@media(max-width:900px){
    .compact-job-details{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .compact-job-details > div:last-child{
        grid-column:1 / -1;
    }
}

@media(max-width:620px){
    .compact-job-details{
        grid-template-columns:1fr;
    }

    .compact-job-details > div:last-child{
        grid-column:auto;
    }

    .compact-practical-row{
        display:grid;
        grid-template-columns:1fr;
        gap:8px;
    }

    .compact-practical-row .check{
        white-space:normal;
    }
}


/* ==========================================================
   Optional duration tidy v26
   ========================================================== */

/* Remove number spinner arrows from Expected duration. */
#project_duration_value{
    appearance:textfield;
    -moz-appearance:textfield;
}

#project_duration_value::-webkit-outer-spin-button,
#project_duration_value::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0;
}


/* ==========================================================
   Practical requirements visibility v28
   ========================================================== */

.compact-practical-row{
    padding:13px 15px !important;
    gap:12px 22px !important;
    min-height:52px !important;
}

.compact-practical-label{
    font-size:13px !important;
    font-weight:900 !important;
    margin-right:8px !important;
}

.compact-practical-row .check{
    gap:8px !important;
    font-size:12px !important;
    font-weight:700 !important;
    line-height:1.3 !important;
}

.compact-practical-row .check input[type="checkbox"]{
    width:19px !important;
    height:19px !important;
    min-width:19px !important;
    min-height:19px !important;
    margin:0 !important;
    cursor:pointer !important;
}

.compact-practical-row .check span{
    cursor:pointer;
}

@media(max-width:620px){
    .compact-practical-row{
        padding:12px !important;
        gap:10px !important;
    }

    .compact-practical-row .check{
        font-size:13px !important;
    }

    .compact-practical-row .check input[type="checkbox"]{
        width:20px !important;
        height:20px !important;
        min-width:20px !important;
        min-height:20px !important;
    }
}


/* ==========================================================
   Company Job Details & Matches v1
   ========================================================== */

.dashboard-job-link{
    color:#fff;
    text-decoration:none;
    border-bottom:1px solid transparent;
}

.dashboard-job-link:hover{
    color:#d7b66e;
    border-bottom-color:rgba(215,182,110,.55);
}

.match-count-link{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    text-decoration:none !important;
    cursor:pointer;
}

.match-count-link:hover{
    transform:translateY(-1px);
    filter:brightness(1.12);
}

.job-detail-page{
    max-width:1480px !important;
    padding-top:42px;
}

.job-detail-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:22px;
}

.job-detail-heading .lead{
    max-width:880px;
    margin-bottom:0;
}

.job-detail-heading-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:10px;
}

.detail-top-actions{
    display:flex;
    align-items:center;
    gap:9px;
}

.detail-top-actions form{
    margin:0;
}

.job-detail-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 320px;
    gap:24px;
    align-items:start;
}

.job-detail-main{
    display:grid;
    gap:18px;
    min-width:0;
}

.job-detail-main > .card,
.job-detail-sidebar .card{
    margin:0;
}

.job-detail-sidebar-sticky{
    position:sticky;
    top:24px;
    display:grid;
    gap:14px;
}

.job-overview-head,
.job-section-heading{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
}

.job-overview-head h2,
.job-section-heading h2{
    margin:0;
}

.job-overview-head .small,
.job-section-heading .small{
    margin:4px 0 0;
}

.job-environment-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:30px;
    padding:6px 10px;
    border:1px solid rgba(0,136,206,.45);
    border-radius:999px;
    background:rgba(0,136,206,.10);
    color:#a9ddf7;
    font-size:11px;
    font-weight:900;
    white-space:nowrap;
}

.job-detail-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-top:17px;
}

.job-detail-item{
    display:grid;
    gap:4px;
    min-width:0;
    padding:11px 12px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:10px;
    background:rgba(255,255,255,.022);
}

.job-detail-item.full{
    grid-column:1 / -1;
}

.job-detail-item span,
.job-rate-notes span,
.candidate-review-grid span,
.match-reason-box > span{
    color:#91a8b8;
    font-size:10px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.05em;
}

.job-detail-item strong,
.job-rate-notes strong,
.candidate-review-grid strong{
    color:#fff;
    font-size:12px;
    line-height:1.45;
    overflow-wrap:anywhere;
}

.job-summary-copy{
    font-weight:600 !important;
}

.job-practical-summary,
.candidate-compliance-row{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:14px;
}

.candidate-check{
    display:inline-flex;
    align-items:center;
    min-height:28px;
    padding:5px 8px;
    border-radius:999px;
    font-size:10px;
    font-weight:900;
}

.candidate-check.yes{
    border:1px solid rgba(59,178,115,.38);
    background:rgba(59,178,115,.10);
    color:#b8f0d0;
}

.candidate-check.no{
    border:1px solid rgba(255,255,255,.11);
    background:rgba(255,255,255,.025);
    color:#91a1ac;
}

.job-rate-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:16px;
}

.job-rate-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    min-width:0;
    padding:10px 11px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:9px;
    background:rgba(255,255,255,.025);
}

.job-rate-row span{
    min-width:0;
    color:#d9e4e9;
    font-size:11px;
    font-weight:800;
    line-height:1.2;
}

.job-rate-row strong{
    color:#fff;
    font-size:11px;
    white-space:nowrap;
}

.job-rate-notes{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
    margin-top:12px;
    padding-top:12px;
    border-top:1px solid rgba(255,255,255,.09);
}

.job-rate-notes > div{
    display:grid;
    gap:4px;
    padding:9px 10px;
    border-radius:8px;
    background:rgba(255,255,255,.02);
}

.matches-heading-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:28px;
    height:28px;
    margin-left:7px;
    padding:0 8px;
    border-radius:999px;
    background:rgba(0,136,206,.14);
    border:1px solid rgba(0,136,206,.36);
    color:#a9ddf7;
    font-size:12px;
    vertical-align:middle;
}

.company-match-list{
    display:grid;
    gap:11px;
    margin-top:16px;
}

.company-match-card{
    display:grid;
    grid-template-columns:90px minmax(0,1fr);
    gap:14px;
    padding:14px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:13px;
    background:rgba(255,255,255,.022);
}

.company-match-score{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    align-self:start;
    min-height:78px;
    border:1px solid rgba(0,136,206,.42);
    border-radius:12px;
    background:rgba(0,136,206,.10);
}

.company-match-score span{
    color:#bfe9fb;
    font-size:26px;
    font-weight:900;
    line-height:1;
}

.company-match-score small{
    margin-top:4px;
    color:#8fb8ca;
    font-size:9px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.company-match-summary{
    min-width:0;
}

.company-match-title-row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.company-match-title-row h3{
    margin:0;
    color:#fff;
    font-size:17px;
}

.company-match-title-row p{
    margin:4px 0 0;
    color:#91a8b8;
    font-size:10px;
}

.candidate-match-status{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:27px;
    padding:5px 8px;
    border-radius:999px;
    font-size:9px;
    font-weight:900;
    text-transform:uppercase;
    white-space:nowrap;
}

.match-status-suggested{
    border:1px solid rgba(0,136,206,.40);
    background:rgba(0,136,206,.10);
    color:#a9ddf7;
}

.match-status-interested{
    border:1px solid rgba(201,164,92,.48);
    background:rgba(201,164,92,.10);
    color:#f1d58f;
}

.match-status-booked{
    border:1px solid rgba(59,178,115,.42);
    background:rgba(59,178,115,.10);
    color:#b8f0d0;
}

.candidate-key-facts{
    display:flex;
    flex-wrap:wrap;
    gap:7px 14px;
    margin-top:10px;
    color:#b9c8d1;
    font-size:10px;
}

.candidate-key-facts strong{
    color:#fff;
}

.match-score-breakdown{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:6px;
    margin-top:11px;
}

.match-score-breakdown span{
    display:grid;
    gap:3px;
    padding:7px 8px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:8px;
    background:rgba(255,255,255,.018);
    color:#8fa4b2;
    font-size:9px;
    text-align:center;
}

.match-score-breakdown strong{
    color:#fff;
    font-size:11px;
}

.candidate-review-details{
    margin-top:11px;
    border-top:1px solid rgba(255,255,255,.09);
    padding-top:10px;
}

.candidate-review-details summary{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:6px 10px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:8px;
    background:#15364d;
    color:#fff;
    font-size:10px;
    font-weight:900;
    cursor:pointer;
    list-style:none;
}

.candidate-review-details summary::-webkit-details-marker{
    display:none;
}

.candidate-review-details[open] summary{
    border-color:rgba(201,164,92,.46);
    background:rgba(201,164,92,.08);
    color:#f1d58f;
}

.candidate-review-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}

.candidate-review-grid > div{
    display:grid;
    gap:4px;
    min-width:0;
    padding:10px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:8px;
    background:rgba(255,255,255,.018);
}

.candidate-review-grid > div.full{
    grid-column:1 / -1;
}

.match-reason-box{
    margin-top:10px;
    padding:10px 12px;
    border:1px solid rgba(0,136,206,.20);
    border-radius:9px;
    background:rgba(0,136,206,.045);
}

.match-reason-box ul{
    margin:7px 0 0;
    padding-left:18px;
    color:#c5d4dc;
    font-size:10px;
    line-height:1.5;
}

.match-reason-box li + li{
    margin-top:4px;
}

.candidate-contact-note{
    margin:10px 0 0;
    color:#8fa4b2;
    font-size:9px;
}

.job-side-card{
    padding:17px;
}

.job-side-card h3{
    margin:0 0 11px;
}

.job-side-card dl{
    margin:0;
}

.job-side-card dl > div{
    display:grid;
    grid-template-columns:1fr 1.2fr;
    gap:9px;
    padding:8px 0;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.job-side-card dl > div:last-child{
    border-bottom:0;
}

.job-side-card dt{
    color:#91a8b8;
    font-size:10px;
    font-weight:800;
}

.job-side-card dd{
    margin:0;
    color:#fff;
    font-size:10px;
    text-align:right;
    overflow-wrap:anywhere;
}

.job-side-card .button{
    width:100%;
    margin-top:10px;
    text-align:center;
}

@media(max-width:1180px){
    .job-detail-page{
        max-width:980px !important;
    }

    .job-detail-layout{
        grid-template-columns:1fr;
    }

    .job-detail-sidebar-sticky{
        position:static;
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .job-rate-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:800px){
    .job-detail-heading{
        align-items:flex-start;
        flex-direction:column;
    }

    .job-detail-heading-actions{
        justify-content:flex-start;
    }

    .job-detail-grid,
    .job-rate-notes,
    .candidate-review-grid{
        grid-template-columns:1fr;
    }

    .job-detail-item.full,
    .candidate-review-grid > div.full{
        grid-column:auto;
    }

    .company-match-card{
        grid-template-columns:1fr;
    }

    .company-match-score{
        min-height:auto;
        width:90px;
        padding:9px;
    }

    .match-score-breakdown{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .job-detail-sidebar-sticky{
        grid-template-columns:1fr;
    }
}

@media(max-width:600px){
    .detail-top-actions{
        display:none;
    }

    .job-rate-grid{
        grid-template-columns:1fr;
    }

    .company-match-title-row{
        flex-direction:column;
    }

    .match-score-breakdown{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .job-side-card dl > div{
        grid-template-columns:1fr;
        gap:3px;
    }

    .job-side-card dd{
        text-align:left;
    }
}


/* ==========================================================
   Matches click clarity v2
   ========================================================== */

.match-count-stack:hover .match-count-hint{
    opacity:1;
}

@media(max-width:700px){
    .match-count-stack{
        min-width:84px;
        padding:8px 10px !important;
    }

    .match-count-number{
        font-size:18px;
    }

    .match-count-hint{
        font-size:8px;
    }
}


/* ==========================================================
   Matches button tidy v3
   ========================================================== */

.matches-cell{
    text-align:center !important;
    vertical-align:middle !important;
}

.match-count-stack{
    display:inline-flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;

    gap:6px !important;

    min-width:72px !important;
    height:30px !important;

    padding:0 10px !important;
    margin:0 !important;

    border-radius:999px !important;
    line-height:1 !important;

    box-sizing:border-box !important;
}

.match-count-number{
    display:inline-block !important;

    font-size:15px !important;
    font-weight:900 !important;
    line-height:1 !important;
}

.match-count-hint{
    display:inline-block !important;

    font-size:8px !important;
    font-weight:900 !important;
    letter-spacing:.05em !important;
    text-transform:uppercase !important;

    line-height:1 !important;
    opacity:.95 !important;
}

/* Keep the status pill vertically balanced with the Matches button. */
.jobs-table td[data-label="Status"]{
    vertical-align:middle !important;
}

.jobs-table .status-badge{
    margin:0 !important;
}

@media(max-width:700px){
    .match-count-stack{
        min-width:68px !important;
        height:29px !important;
        padding:0 9px !important;
    }

    .match-count-number{
        font-size:14px !important;
    }
}


/* ==========================================================
   Company Dashboard wide desktop cleanup v4
   ========================================================== */

.company-dashboard-page{
    max-width:1480px !important;
    padding-top:38px !important;
}

.company-dashboard-page > .eyebrow,
.company-dashboard-page > h1,
.company-dashboard-page > .lead{
    max-width:980px;
}

.company-dashboard-page > h1{
    margin-bottom:8px;
}

.company-dashboard-page > .lead{
    margin-bottom:22px;
}

.company-dashboard-page .dashboard-grid{
    grid-template-columns:minmax(320px,.8fr) minmax(520px,1.2fr) !important;
    gap:18px !important;
    align-items:stretch;
}

.company-dashboard-page .dashboard-card{
    padding:20px !important;
    border-radius:15px !important;
}

.company-dashboard-page .account-overview-card,
.company-dashboard-page .company-overview-card{
    min-height:0;
}
.company-dashboard-page .company-overview-card{
    grid-column:1 / -1 !important;
}

.dashboard-card-title-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:10px;
}

.dashboard-card-title-row h2{
    margin:0 !important;
}

.compact-verified-status{
    padding:5px 9px !important;
    font-size:9px !important;
    white-space:nowrap;
}

.company-dashboard-page .account-overview-card .small{
    line-height:1.55;
}

.company-dashboard-page .company-overview-card p{
    margin-top:8px;
    margin-bottom:8px;
}

.company-dashboard-page .company-overview-card .actions{
    margin-top:16px;
}

.company-dashboard-page .company-overview-card .button{
    width:auto;
    min-width:240px;
}

/* Jobs & Matches gets the full desktop canvas. */
.company-dashboard-page .company-jobs-wide{
    grid-column:1 / -1 !important;
    padding:22px 24px !important;
}

.company-dashboard-page .company-jobs-wide .card-heading-row{
    align-items:center;
    margin-bottom:12px;
}

.company-dashboard-page .company-jobs-wide .job-summary-grid{
    gap:14px !important;
    margin:16px 0 22px !important;
}

.company-dashboard-page .company-jobs-wide .job-summary{
    min-height:88px;
    padding:15px 16px !important;
}

.company-dashboard-page .company-jobs-wide .job-summary-number{
    font-size:30px !important;
}

.company-dashboard-page .company-jobs-wide .job-summary-label{
    font-size:11px !important;
}

/* Desktop table uses width instead of forcing a horizontal-scroll mindset. */
@media(min-width:1051px){
    .company-dashboard-page .company-jobs-wide .jobs-table-wrap{
        overflow:visible !important;
    }

    .company-dashboard-page .company-jobs-wide .jobs-table{
        min-width:0 !important;
        width:100% !important;
        table-layout:fixed !important;
    }

    .company-dashboard-page .company-jobs-wide .jobs-table th:nth-child(1),
    .company-dashboard-page .company-jobs-wide .jobs-table td:nth-child(1){
        width:19%;
    }

    .company-dashboard-page .company-jobs-wide .jobs-table th:nth-child(2),
    .company-dashboard-page .company-jobs-wide .jobs-table td:nth-child(2){
        width:31%;
    }

    .company-dashboard-page .company-jobs-wide .jobs-table th:nth-child(3),
    .company-dashboard-page .company-jobs-wide .jobs-table td:nth-child(3){
        width:15%;
    }

    .company-dashboard-page .company-jobs-wide .jobs-table th:nth-child(4),
    .company-dashboard-page .company-jobs-wide .jobs-table td:nth-child(4){
        width:15%;
        text-align:center;
    }

    .company-dashboard-page .company-jobs-wide .jobs-table th:nth-child(5),
    .company-dashboard-page .company-jobs-wide .jobs-table td:nth-child(5){
        width:20%;
    }
}

.company-dashboard-page .company-jobs-wide .jobs-table th,
.company-dashboard-page .company-jobs-wide .jobs-table td{
    vertical-align:middle !important;
    padding:14px 16px !important;
}

.company-dashboard-page .company-jobs-wide .jobs-table th{
    font-size:10px !important;
}

.company-dashboard-page .company-jobs-wide .jobs-table td{
    font-size:12px !important;
}

.company-dashboard-page .company-jobs-wide .previous-heading{
    margin-top:22px !important;
}

.company-dashboard-page .company-jobs-wide .empty-state.compact{
    padding:11px 14px !important;
    min-height:0 !important;
}

.company-dashboard-page .company-jobs-wide .dashboard-note{
    margin-top:16px !important;
    padding:12px 14px !important;
    border:1px solid rgba(255,255,255,.08) !important;
    border-radius:9px;
    background:rgba(255,255,255,.018);
    line-height:1.45;
}

/* Keep the New Requirement action strong without being enormous. */
.company-dashboard-page .company-jobs-wide .card-heading-row > .button{
    min-width:180px;
    text-align:center;
}

/* HD / larger desktop gets a little more horizontal breathing room. */
@media(min-width:1500px){
    .company-dashboard-page{
        max-width:1520px !important;
    }

    .company-dashboard-page .dashboard-grid{
        gap:22px !important;
    }

    .company-dashboard-page .company-jobs-wide{
        padding:24px 28px !important;
    }
}

/* Laptop/tablet: return to the existing clean single-column behaviour. */
@media(max-width:1050px){
    .company-dashboard-page{
        max-width:940px !important;
    }

    .company-dashboard-page .dashboard-grid{
        grid-template-columns:1fr !important;
    }

    .company-dashboard-page .account-overview-card,
    .company-dashboard-page .company-overview-card{
        min-height:0;
    }

    .company-dashboard-page .company-jobs-wide{
        grid-column:auto !important;
    }

    .company-dashboard-page .company-overview-card .button{
        min-width:0;
    }
}

@media(max-width:620px){
    .company-dashboard-page{
        padding-top:28px !important;
    }

    .dashboard-card-title-row{
        align-items:flex-start;
        flex-direction:column;
    }

    .company-dashboard-page .company-jobs-wide{
        padding:16px !important;
    }
}


/* ==========================================================
   Clear match action vs status v5
   ========================================================== */

/* One obvious action: View X matches */
.company-dashboard-page .match-count-stack{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    min-width:132px !important;
    height:38px !important;

    padding:0 16px !important;
    margin:0 !important;

    border:1px solid rgba(42,132,190,.58) !important;
    border-radius:10px !important;

    background:rgba(42,132,190,.18) !important;
    color:#c9edff !important;

    text-decoration:none !important;
    cursor:pointer !important;

    transition:
        background .16s ease,
        border-color .16s ease,
        transform .16s ease;
}

.company-dashboard-page .match-count-stack:hover{
    background:rgba(42,132,190,.28) !important;
    border-color:rgba(90,180,235,.75) !important;
    transform:translateY(-1px);
}

.company-dashboard-page .match-view-label{
    font-size:11px !important;
    font-weight:900 !important;
    line-height:1 !important;
    white-space:nowrap !important;
    letter-spacing:.01em;
}

/*
   "Matches available" is status information only.
   Remove anything that makes it resemble a button.
*/
.company-dashboard-page .jobs-table .status-matches{
    padding:0 !important;

    border:0 !important;
    border-radius:0 !important;

    background:transparent !important;

    color:#9fc9df !important;

    font-size:11px !important;
    font-weight:700 !important;
    text-transform:none !important;
    letter-spacing:0 !important;

    cursor:default !important;
}

.company-dashboard-page .jobs-table td[data-label="Status"]{
    text-align:left !important;
}

/* Centre the actual match action under its table heading. */
.company-dashboard-page .jobs-table th:nth-child(4),
.company-dashboard-page .jobs-table td:nth-child(4){
    text-align:center !important;
}

@media(max-width:700px){
    .company-dashboard-page .match-count-stack{
        min-width:120px !important;
        height:36px !important;
        padding:0 13px !important;
    }

    .company-dashboard-page .match-view-label{
        font-size:10px !important;
    }
}


/* ==========================================================
   Controlled Introductions v1
   ========================================================== */

.intro-page-message{
    margin:0 0 18px !important;
}

/* Company match status */
.match-status-intro-requested{
    border-color:rgba(61,160,225,.48) !important;
    background:rgba(61,160,225,.12) !important;
    color:#bfe9ff !important;
}

.match-status-intro-accepted{
    border-color:rgba(80,190,130,.48) !important;
    background:rgba(80,190,130,.12) !important;
    color:#c9f5da !important;
}

.match-status-intro-declined{
    border-color:rgba(160,170,180,.26) !important;
    background:rgba(160,170,180,.08) !important;
    color:#aab5bd !important;
}

/* Company-side controlled introduction panel */
.candidate-introduction-panel{
    margin-top:16px;
    padding-top:16px;
    border-top:1px solid rgba(255,255,255,.08);
}

.introduction-request,
.introduction-waiting,
.introduction-unlocked,
.introduction-declined{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;

    padding:16px 18px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.025);
}

.introduction-request{
    border-color:rgba(212,170,74,.23);
    background:rgba(212,170,74,.045);
}

.introduction-waiting{
    border-color:rgba(61,160,225,.24);
    background:rgba(61,160,225,.045);
}

.introduction-unlocked{
    align-items:flex-start;
    border-color:rgba(80,190,130,.24);
    background:rgba(80,190,130,.045);
}

.introduction-declined{
    border-color:rgba(160,170,180,.15);
    background:rgba(160,170,180,.025);
}

.introduction-request p,
.introduction-waiting p,
.introduction-unlocked p,
.introduction-declined p{
    margin:5px 0 0;
    max-width:670px;
    font-size:12px;
    line-height:1.5;
    color:var(--muted, #aab6c2);
}

.intro-kicker{
    display:block;
    margin-bottom:4px;
    font-size:9px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--gold, #d4aa4a);
}

.introduction-waiting .intro-kicker{
    color:#83cfff;
}

.introduction-unlocked .intro-kicker{
    color:#87dda8;
}

.introduction-declined .intro-kicker{
    color:#9da8b1;
}

.intro-request-button{
    min-width:190px;
    white-space:nowrap;
}

.intro-contact-grid{
    display:grid;
    grid-template-columns:minmax(180px,1fr) minmax(140px,.7fr);
    gap:10px;
    min-width:390px;
}

.intro-contact-grid > div{
    padding:10px 12px;
    border-radius:9px;
    background:rgba(0,0,0,.14);
}

.intro-contact-grid span{
    display:block;
    margin-bottom:3px;
    font-size:9px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--muted, #aab6c2);
}

.intro-contact-grid a{
    color:#d7f3ff;
    font-weight:800;
    text-decoration:none;
    overflow-wrap:anywhere;
}

.intro-contact-grid a:hover{
    text-decoration:underline;
}

/* Floorlayer-side introduction request */
.intro-floorlayer-request{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
}

.intro-requested-label{
    display:block;
    font-size:10px;
    font-weight:850;
    color:#bfe9ff;
}

.mini-action.intro-accept{
    border-color:rgba(80,190,130,.45) !important;
    background:rgba(80,190,130,.12) !important;
    color:#c9f5da !important;
}

.mini-action.intro-accept:hover{
    background:rgba(80,190,130,.22) !important;
}

.floorlayer-contact-unlocked{
    min-width:175px;
}

.floorlayer-contact-unlocked summary{
    cursor:pointer;
    list-style:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:7px 10px;
    border-radius:8px;
    border:1px solid rgba(80,190,130,.38);
    background:rgba(80,190,130,.09);

    font-size:10px;
    font-weight:850;
    color:#c9f5da;
}

.floorlayer-contact-unlocked summary::-webkit-details-marker{
    display:none;
}

.floorlayer-contact-card{
    margin-top:8px;
    display:flex;
    flex-direction:column;
    gap:4px;

    padding:10px;
    border-radius:9px;
    border:1px solid rgba(255,255,255,.08);
    background:#101c26;

    font-size:10px;
    line-height:1.35;
}

.floorlayer-contact-card strong{
    font-size:11px;
    color:#fff;
}

.floorlayer-contact-card span{
    color:var(--muted, #aab6c2);
}

.floorlayer-contact-card a{
    color:#bfe9ff;
    text-decoration:none;
    overflow-wrap:anywhere;
}

.floorlayer-contact-card a:hover{
    text-decoration:underline;
}

.company-match-card:target{
    outline:1px solid rgba(61,160,225,.55);
    box-shadow:0 0 0 4px rgba(61,160,225,.08);
}

@media(max-width:900px){
    .introduction-request,
    .introduction-waiting,
    .introduction-unlocked,
    .introduction-declined{
        align-items:flex-start;
        flex-direction:column;
    }

    .intro-contact-grid{
        width:100%;
        min-width:0;
    }

    .intro-request-button{
        min-width:0;
        width:100%;
    }
}

@media(max-width:560px){
    .intro-contact-grid{
        grid-template-columns:1fr;
    }
}


/* ==========================================================
   Floorlayer introduction buttons tidy v2
   ========================================================== */

.intro-floorlayer-request{
    min-width:170px !important;
    width:100% !important;
    max-width:210px !important;
}

.intro-floorlayer-request .match-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:7px !important;
    width:100% !important;
    margin-top:2px !important;
}

.intro-floorlayer-request .match-actions form{
    width:100% !important;
    margin:0 !important;
}

.intro-floorlayer-request .match-actions .mini-action{
    width:100% !important;
    min-width:0 !important;
    padding:8px 10px !important;
    white-space:nowrap !important;
    text-align:center !important;
}

.intro-requested-label{
    max-width:100% !important;
    line-height:1.3 !important;
}

/* Give the floorlayer action column a little more room on desktop. */
@media(min-width:1051px){
    .floorlayer-work-table th:last-child,
    .floorlayer-work-table td:last-child{
        width:205px !important;
        min-width:205px !important;
    }
}

@media(max-width:1050px){
    .intro-floorlayer-request{
        max-width:none !important;
    }
}

/* ==========================================================
   External email action - tidy two-line button v4
   ========================================================== */

.floorlayer-contact-unlocked[open] .floorlayer-contact-card{
    margin-bottom:8px;
}

.floorlayer-email-company-button{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;

    width:100%;
    box-sizing:border-box;

    min-height:46px;
    margin-top:8px;
    padding:8px 10px;

    border:1px solid rgba(212,170,74,.52);
    border-radius:8px;
    background:rgba(212,170,74,.12);

    text-align:center;
    text-decoration:none !important;

    transition:
        background .16s ease,
        border-color .16s ease,
        transform .16s ease;
}

.floorlayer-email-company-button:hover{
    background:rgba(212,170,74,.22);
    border-color:rgba(232,193,98,.78);
    transform:translateY(-1px);
    text-decoration:none !important;
}

.floorlayer-email-company-label{
    display:block;
    color:#f4cc69;
    font-size:10px;
    font-weight:900;
    line-height:1.1;
    letter-spacing:.02em;
}

.floorlayer-email-company-note{
    display:block;
    color:#aebbc6;
    font-size:8px;
    font-weight:600;
    line-height:1.15;
}

@media(max-width:700px){
    .floorlayer-email-company-button{
        min-height:44px;
    }
}


/* ==========================================================
   Floorlayer rate panel - no inner table scrolling v5
   ========================================================== */

/*
   Allow opened rate/contact details to extend naturally beyond the
   table wrapper instead of turning Current opportunities into its
   own vertical scroll box.
*/
#work-matches .jobs-table-wrap{
    overflow:visible !important;
}

/*
   Keep the existing rate pop-out behaviour, but make certain it can
   render outside the table wrapper without being clipped.
*/
#work-matches .job-rate-details{
    position:relative !important;
    z-index:40;
}

#work-matches .job-rate-details[open]{
    z-index:60;
}

#work-matches .job-rate-panel{
    z-index:70 !important;
}

/* Contact details should also be allowed to expand the row cleanly. */
#work-matches .floorlayer-contact-unlocked,
#work-matches .floorlayer-contact-card{
    overflow:visible !important;
}

/*
   On smaller screens, use an in-flow rate panel so it remains readable
   without extending beyond the viewport.
*/
@media(max-width:760px){
    #work-matches .job-rate-panel{
        position:static !important;
        transform:none !important;
        width:100% !important;
        max-width:100% !important;
        margin-top:8px !important;
        box-shadow:none !important;
    }
}


/* ==========================================================
   FLOORLAYER CONNECT
   PHASE 2 - GLOBAL VISUAL SYSTEM
   05 September 2026
   ========================================================== */

:root{
    --flc-page-max:1480px;
    --flc-page-max-large:1520px;

    --flc-surface:#10283b;
    --flc-surface-soft:#122c40;
    --flc-surface-deep:#0c2030;

    --flc-border:rgba(255,255,255,.13);
    --flc-border-soft:rgba(255,255,255,.08);

    --flc-radius:14px;
    --flc-radius-small:9px;

    --flc-shadow:0 14px 34px rgba(0,0,0,.16);

    --flc-blue-soft:rgba(42,132,190,.14);
    --flc-blue-line:rgba(42,132,190,.42);
    --flc-blue-text:#bfe9ff;

    --flc-gold-soft:rgba(201,164,92,.12);
    --flc-gold-line:rgba(201,164,92,.40);
    --flc-gold-text:#f0d79e;

    --flc-green-soft:rgba(61,174,112,.13);
    --flc-green-line:rgba(61,174,112,.42);
    --flc-green-text:#c8f3d7;

    --flc-grey-soft:rgba(255,255,255,.055);
    --flc-grey-line:rgba(255,255,255,.15);
    --flc-grey-text:#c5cdd2;
}


/* ----------------------------------------------------------
   1. Wide logged-in workspace
   ---------------------------------------------------------- */

.topbar-inner{
    max-width:var(--flc-page-max-large);
    width:100%;
}

.dashboard-page,
.requirement-page,
.company-profile-page,
.job-detail-page{
    width:100%;
    max-width:var(--flc-page-max) !important;
    padding-left:26px !important;
    padding-right:26px !important;
    padding-top:38px !important;
    padding-bottom:74px !important;
}

@media(min-width:1580px){
    .dashboard-page,
    .requirement-page,
    .company-profile-page,
    .job-detail-page{
        max-width:var(--flc-page-max-large) !important;
    }
}


/* ----------------------------------------------------------
   2. Page headings
   ---------------------------------------------------------- */

.dashboard-page > .eyebrow,
.requirement-page .eyebrow,
.company-profile-page > .eyebrow,
.job-detail-page .eyebrow{
    margin-bottom:7px;
    font-size:11px;
    letter-spacing:.14em;
}

.dashboard-page > h1,
.requirement-page h1,
.company-profile-page > h1,
.job-detail-page h1{
    margin-bottom:9px;
    font-size:clamp(34px,4vw,48px);
    line-height:1.04;
    letter-spacing:-.02em;
}

.dashboard-page > .lead,
.requirement-page .lead,
.company-profile-page > .lead,
.job-detail-page .lead{
    margin-bottom:22px;
    font-size:15px;
    line-height:1.55;
}


/* ----------------------------------------------------------
   3. Card system
   ---------------------------------------------------------- */

.card,
.dashboard-card,
.summary-card,
.job-side-card,
.company-match-card,
.requirement-summary-card,
.company-details-card,
.company-rate-panel{
    border-color:var(--flc-border) !important;
    border-radius:var(--flc-radius) !important;
}

.card,
.dashboard-card,
.company-match-card{
    box-shadow:var(--flc-shadow);
}

.dashboard-card{
    background:rgba(16,40,59,.88);
}

.card-heading-row{
    gap:16px;
}

.card-heading-row h2,
.dashboard-card h2{
    letter-spacing:-.01em;
}

.divider{
    background:var(--flc-border-soft);
}


/* ----------------------------------------------------------
   4. Button hierarchy
   ---------------------------------------------------------- */

.button,
.mini-action,
.match-count-stack,
.floorlayer-email-company-button,
button{
    transition:
        background-color .15s ease,
        border-color .15s ease,
        color .15s ease,
        transform .15s ease,
        box-shadow .15s ease;
}

.button{
    min-height:42px;
    border-radius:9px;
    padding:11px 17px;
    box-shadow:none;
}

.button:hover{
    transform:translateY(-1px);
    filter:brightness(1.04);
}

.button:active,
.mini-action:active,
.match-count-stack:active,
.floorlayer-email-company-button:active{
    transform:translateY(0);
}

.button.secondary{
    background:#16344a;
    color:#fff;
    border:1px solid var(--flc-border);
}

.button.secondary:hover{
    background:#1a3d56;
    border-color:rgba(255,255,255,.23);
}

.mini-action{
    border-radius:8px !important;
}

.mini-action:not(.decline):not(.intro-accept){
    border-color:var(--flc-blue-line) !important;
    background:var(--flc-blue-soft) !important;
    color:var(--flc-blue-text) !important;
}

.mini-action:not(.decline):not(.intro-accept):hover{
    background:rgba(42,132,190,.23) !important;
}

.mini-action.decline{
    border-color:var(--flc-grey-line) !important;
    background:var(--flc-grey-soft) !important;
    color:var(--flc-grey-text) !important;
}

.mini-action.decline:hover{
    border-color:rgba(216,93,93,.42) !important;
    background:rgba(216,93,93,.09) !important;
    color:#efcaca !important;
}

.mini-action.intro-accept{
    border-color:var(--flc-green-line) !important;
    background:var(--flc-green-soft) !important;
    color:var(--flc-green-text) !important;
}

.button:focus-visible,
.mini-action:focus-visible,
.match-count-stack:focus-visible,
.floorlayer-email-company-button:focus-visible,
a:focus-visible,
summary:focus-visible{
    outline:2px solid rgba(105,199,243,.9) !important;
    outline-offset:3px !important;
}


/* ----------------------------------------------------------
   5. Status language
   GOLD  = live / waiting
   BLUE  = match / action / interested
   GREEN = accepted / booked / completed
   GREY  = closed / declined / archived
   ---------------------------------------------------------- */

.status,
.job-status,
.candidate-match-status{
    border-radius:999px !important;
    font-weight:800;
}

/* GOLD */
.status-live,
.status-waiting,
.match-status-intro-requested{
    color:var(--flc-gold-text) !important;
    background:var(--flc-gold-soft) !important;
    border-color:var(--flc-gold-line) !important;
}

/* BLUE */
.status-matches,
.status-new-match,
.status-potential-job,
.status-interested{
    color:var(--flc-blue-text) !important;
    background:var(--flc-blue-soft) !important;
    border-color:var(--flc-blue-line) !important;
}

/* GREEN */
.status-filled,
.status-completed,
.status-booked,
.status-work-completed,
.match-status-intro-accepted{
    color:var(--flc-green-text) !important;
    background:var(--flc-green-soft) !important;
    border-color:var(--flc-green-line) !important;
}

/* GREY */
.status-closed,
.status-declined,
.status-archived,
.match-status-intro-declined{
    color:var(--flc-grey-text) !important;
    background:var(--flc-grey-soft) !important;
    border-color:var(--flc-grey-line) !important;
}


/* ----------------------------------------------------------
   6. Messages
   ---------------------------------------------------------- */

.message{
    border-radius:10px;
    padding:12px 15px;
    line-height:1.45;
}

.message.success{
    color:#e4f7eb;
}

.message.info{
    color:#d9edf7;
}

.message.error{
    color:#f5dcdc;
}


/* ----------------------------------------------------------
   7. Forms
   ---------------------------------------------------------- */

input,
select,
textarea{
    border-radius:8px;
    border-color:rgba(255,255,255,.16);
    background:var(--flc-surface-deep);
}

input:hover,
select:hover,
textarea:hover{
    border-color:rgba(255,255,255,.23);
}

input:focus,
select:focus,
textarea:focus{
    outline:2px solid rgba(0,136,206,.48);
    outline-offset:1px;
    border-color:rgba(105,199,243,.58);
}

label.field{
    color:#edf4f7;
}

.help,
.small{
    color:#aebbc5;
}


/* ----------------------------------------------------------
   8. Tables
   ---------------------------------------------------------- */

.jobs-table-wrap{
    border-color:var(--flc-border);
    border-radius:11px;
    background:rgba(7,24,39,.12);
}

.jobs-table th{
    padding-top:12px;
    padding-bottom:12px;
    background:rgba(255,255,255,.035);
    color:#aec0cb;
    font-size:10px;
    letter-spacing:.055em;
}

.jobs-table td{
    padding-top:13px;
    padding-bottom:13px;
    border-bottom-color:var(--flc-border-soft);
}

.jobs-table tbody tr{
    transition:background-color .12s ease;
}

.jobs-table tbody tr:hover{
    background:rgba(255,255,255,.028);
}


/* ----------------------------------------------------------
   9. Dashboard summaries
   ---------------------------------------------------------- */

.job-summary-grid{
    gap:12px !important;
}

.job-summary{
    border-radius:11px !important;
}

.job-summary-number{
    letter-spacing:-.03em;
}

.job-summary-label{
    letter-spacing:.025em;
}


/* ----------------------------------------------------------
   10. Match cards / introduction panels
   ---------------------------------------------------------- */

.company-match-card{
    background:rgba(16,40,59,.77);
}

.introduction-request,
.introduction-waiting,
.introduction-unlocked,
.introduction-declined{
    border-radius:11px;
}

.match-score-pill{
    box-shadow:none !important;
}

.floorlayer-contact-card{
    border-color:var(--flc-border);
    background:rgba(7,24,39,.72);
}


/* ----------------------------------------------------------
   11. Compact visual rhythm
   ---------------------------------------------------------- */

.dashboard-grid{
    gap:18px;
}

.company-dashboard-page .dashboard-grid{
    gap:18px !important;
}

.company-dashboard-page .company-jobs-wide{
    margin-top:0;
}

.previous-heading{
    margin-bottom:10px;
}

.empty-state{
    border-radius:10px;
}


/* ----------------------------------------------------------
   12. Responsive consistency
   ---------------------------------------------------------- */

@media(max-width:1050px){
    .dashboard-page,
    .requirement-page,
    .company-profile-page,
    .job-detail-page{
        max-width:980px !important;
        padding-left:22px !important;
        padding-right:22px !important;
    }
}

@media(max-width:720px){
    .topbar{
        padding:16px 18px;
    }

    .dashboard-page,
    .requirement-page,
    .company-profile-page,
    .job-detail-page{
        padding:
            28px 16px
            58px !important;
    }

    .dashboard-page > h1,
    .requirement-page h1,
    .company-profile-page > h1,
    .job-detail-page h1{
        font-size:clamp(31px,10vw,40px);
    }

    .dashboard-page > .lead,
    .requirement-page .lead,
    .company-profile-page > .lead,
    .job-detail-page .lead{
        font-size:14px;
    }

    .card,
    .dashboard-card{
        border-radius:12px !important;
    }

    .button{
        min-height:40px;
    }
}


/* ----------------------------------------------------------
   13. Reduced-motion accessibility
   ---------------------------------------------------------- */

@media(prefers-reduced-motion:reduce){
    *,
    *::before,
    *::after{
        scroll-behavior:auto !important;
        transition-duration:.01ms !important;
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
    }
}


/* ==========================================================
   Company accepted-introduction cleanup v1
   ========================================================== */

@media(min-width:860px){
    .introduction-unlocked{
        display:grid !important;
        grid-template-columns:minmax(260px,1fr) minmax(470px,1.15fr) !important;
        align-items:start !important;
        gap:18px !important;
    }

    .intro-contact-grid{
        width:100% !important;
        min-width:0 !important;
        grid-template-columns:minmax(285px,1fr) 150px !important;
    }

    .intro-contact-grid a{
        overflow-wrap:normal !important;
        word-break:normal !important;
        white-space:nowrap !important;
    }
}

@media(max-width:859px){
    .introduction-unlocked{
        display:flex !important;
        flex-direction:column !important;
        align-items:stretch !important;
    }

    .intro-contact-grid{
        width:100% !important;
        min-width:0 !important;
    }

    .intro-contact-grid a{
        overflow-wrap:anywhere !important;
        white-space:normal !important;
    }
}


/* ==========================================================
   PHASE 4 - ROLE-AWARE AUTHENTICATED HOME
   ========================================================== */

.role-home-page{
    max-width:1480px !important;
    padding-top:42px !important;
}

.role-home-top-actions{
    display:flex;
    align-items:center;
    gap:14px;
}

.role-home-dashboard-link{
    color:#c8d8e2;
    font-size:12px;
    font-weight:800;
    text-decoration:none;
}

.role-home-dashboard-link:hover{
    color:#fff;
}

.role-home-heading-row{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:28px;
    margin-bottom:24px;
}

.role-home-heading-row > div:first-child{
    max-width:920px;
}

.role-home-role-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:0 13px;
    margin-top:4px;
    border-radius:999px;
    border:1px solid var(--flc-gold-line);
    background:var(--flc-gold-soft);
    color:var(--flc-gold-text);
    font-size:10px;
    font-weight:900;
    letter-spacing:.06em;
    text-transform:uppercase;
    white-space:nowrap;
}

.workspace-switcher{
    display:flex;
    align-items:center;
    gap:6px;
    padding:5px;
    margin-top:2px;
    border:1px solid var(--flc-border);
    border-radius:10px;
    background:rgba(5,20,32,.45);
}

.workspace-switcher > span{
    padding:0 7px;
    color:#8fa4b2;
    font-size:9px;
    font-weight:850;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.workspace-switcher a{
    padding:8px 11px;
    border-radius:7px;
    color:#b9c9d3;
    font-size:11px;
    font-weight:850;
    text-decoration:none;
}

.workspace-switcher a:hover{
    color:#fff;
    background:rgba(255,255,255,.045);
}

.workspace-switcher a.active{
    color:#0a1d2b;
    background:#d2a94f;
}

.role-home-summary-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin-bottom:18px;
}

.role-home-stat{
    position:relative;
    min-height:132px;
    padding:20px 20px 18px;
    overflow:hidden;
    border:1px solid var(--flc-border);
    border-radius:13px;
    background:rgba(16,40,59,.86);
    box-shadow:var(--flc-shadow);
}

.role-home-stat::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:4px;
}

.role-home-stat.stat-gold::before{
    background:#d2a94f;
}

.role-home-stat.stat-blue::before{
    background:#288fc7;
}

.role-home-stat.stat-green::before{
    background:#3aae70;
}

.role-home-stat-number{
    display:block;
    margin-bottom:4px;
    color:#fff;
    font-size:34px;
    line-height:1;
    font-weight:950;
    letter-spacing:-.04em;
}

.role-home-stat strong{
    display:block;
    margin-bottom:7px;
    color:#fff;
    font-size:13px;
}

.role-home-stat small{
    display:block;
    color:#aebbc5;
    font-size:11px;
    line-height:1.45;
}

.role-home-main-grid{
    display:grid;
    grid-template-columns:1.25fr 1fr 1fr;
    gap:14px;
}

.role-home-primary-card,
.role-home-card{
    display:flex;
    flex-direction:column;
    min-height:235px;
    padding:22px;
    border:1px solid var(--flc-border);
    border-radius:14px;
    background:rgba(16,40,59,.86);
    box-shadow:var(--flc-shadow);
}

.role-home-primary-card{
    border-color:rgba(210,169,79,.34);
    background:
        linear-gradient(
            145deg,
            rgba(210,169,79,.07),
            rgba(16,40,59,.9) 42%
        );
}

.role-home-card-kicker{
    margin-bottom:7px;
    color:#d6b86d;
    font-size:9px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.role-home-primary-card h2,
.role-home-card h2,
.role-home-guidance h2{
    margin:0 0 9px;
    color:#fff;
    font-size:20px;
    line-height:1.18;
}

.role-home-primary-card p,
.role-home-card p,
.role-home-guidance p{
    margin:0;
    color:#b3c1ca;
    font-size:12px;
    line-height:1.55;
}

.role-home-primary-card .button,
.role-home-card .button{
    align-self:flex-start;
    margin-top:auto;
}

.role-home-guidance{
    margin-top:18px;
    padding:20px 22px;
    border:1px dashed rgba(255,255,255,.14);
    border-radius:13px;
    background:rgba(255,255,255,.018);
}

.role-home-guidance > div{
    max-width:880px;
}

@media(max-width:1050px){
    .role-home-main-grid{
        grid-template-columns:1fr 1fr;
    }

    .role-home-primary-card{
        grid-column:1 / -1;
    }
}

@media(max-width:760px){
    .role-home-heading-row{
        flex-direction:column;
        gap:12px;
    }

    .role-home-summary-grid,
    .role-home-main-grid{
        grid-template-columns:1fr;
    }

    .role-home-primary-card{
        grid-column:auto;
    }

    .role-home-primary-card,
    .role-home-card{
        min-height:0;
    }

    .role-home-primary-card .button,
    .role-home-card .button{
        margin-top:18px;
    }

    .role-home-top-actions{
        gap:8px;
    }

    .role-home-dashboard-link{
        display:none;
    }

    .workspace-switcher{
        width:100%;
        box-sizing:border-box;
    }

    .workspace-switcher a{
        flex:1;
        text-align:center;
    }
}


/* ==========================================================
   DUAL-ROLE WORKSPACE SWITCH BUTTON V1
   ========================================================== */

.role-home-workspace-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:9px;
    margin-top:2px;
    flex-wrap:wrap;
}

.role-home-workspace-actions .role-home-role-pill{
    margin-top:0;
}

.workspace-switch-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:34px;
    padding:0 13px;

    border:1px solid var(--flc-blue-line);
    border-radius:9px;
    background:var(--flc-blue-soft);

    color:var(--flc-blue-text);
    font-size:10px;
    font-weight:900;
    letter-spacing:.02em;
    text-decoration:none;
    white-space:nowrap;

    transition:
        background-color .15s ease,
        border-color .15s ease,
        color .15s ease,
        transform .15s ease;
}

.workspace-switch-button:hover{
    background:rgba(42,132,190,.24);
    border-color:rgba(90,180,235,.7);
    color:#fff;
    transform:translateY(-1px);
}

.workspace-switch-button:active{
    transform:translateY(0);
}

.workspace-switch-button:focus-visible{
    outline:2px solid rgba(105,199,243,.9);
    outline-offset:3px;
}

/*
   Retire the old tab switcher styles visually without removing
   historical CSS. They are no longer used by home.php.
*/
.workspace-switcher{
    display:none !important;
}

@media(max-width:760px){
    .role-home-workspace-actions{
        width:100%;
        justify-content:flex-start;
    }

    .workspace-switch-button{
        min-height:36px;
    }
}


/* ==========================================================
   FLOORLAYER HOME - OPPORTUNITY PREVIEW V1
   ========================================================== */

.role-home-opportunities-card{
    min-height:0 !important;
}

.role-home-opportunities-heading{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:14px;
}

.role-home-opportunities-heading h2{
    margin-bottom:5px;
}

.role-home-opportunity-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;

    min-width:34px;
    height:34px;
    padding:0 9px;

    border:1px solid var(--flc-blue-line);
    border-radius:999px;
    background:var(--flc-blue-soft);

    color:var(--flc-blue-text);
    font-size:14px;
    font-weight:950;
}

.role-home-opportunity-list{
    display:flex;
    flex-direction:column;
    gap:7px;
    margin:2px 0 16px;
}

.role-home-opportunity-row{
    display:grid;
    grid-template-columns:
        minmax(170px,1.3fr)
        minmax(95px,.7fr)
        68px
        minmax(105px,.75fr);

    align-items:center;
    gap:12px;

    min-height:58px;
    padding:10px 12px;

    border:1px solid rgba(255,255,255,.085);
    border-radius:9px;

    background:rgba(6,24,38,.35);
}

.role-home-opportunity-main,
.role-home-opportunity-start,
.role-home-opportunity-match{
    min-width:0;
}

.role-home-opportunity-main strong{
    display:block;
    margin-bottom:3px;

    color:#fff;
    font-size:11px;
    line-height:1.2;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.role-home-opportunity-main span{
    display:block;

    color:#aebbc5;
    font-size:9px;
    line-height:1.25;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.role-home-opportunity-start span,
.role-home-opportunity-match span{
    display:block;
    margin-bottom:2px;

    color:#8398a6;
    font-size:8px;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.role-home-opportunity-start strong{
    display:block;
    color:#eef5f8;
    font-size:10px;
    white-space:nowrap;
}

.role-home-opportunity-match{
    text-align:center;
}

.role-home-opportunity-match strong{
    display:block;
    color:#bfe9ff;
    font-size:15px;
    line-height:1;
}

.role-home-preview-status{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:26px;
    padding:0 8px;

    border:1px solid;
    border-radius:999px;

    font-size:8px;
    font-weight:900;
    line-height:1.1;
    text-align:center;
}

.role-home-preview-status.preview-status-match{
    color:var(--flc-blue-text);
    border-color:var(--flc-blue-line);
    background:var(--flc-blue-soft);
}

.role-home-preview-status.preview-status-waiting{
    color:var(--flc-gold-text);
    border-color:var(--flc-gold-line);
    background:var(--flc-gold-soft);
}

.role-home-preview-status.preview-status-accepted{
    color:var(--flc-green-text);
    border-color:var(--flc-green-line);
    background:var(--flc-green-soft);
}

.role-home-opportunity-empty{
    display:flex;
    flex-direction:column;
    gap:5px;

    margin:2px 0 16px;
    padding:16px;

    border:1px dashed rgba(255,255,255,.13);
    border-radius:9px;

    background:rgba(255,255,255,.018);
}

.role-home-opportunity-empty strong{
    color:#fff;
    font-size:11px;
}

.role-home-opportunity-empty span{
    color:#9eafba;
    font-size:10px;
    line-height:1.4;
}

.role-home-opportunities-footer{
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:auto;
}

.role-home-opportunities-footer .button{
    margin-top:0 !important;
}

.role-home-opportunities-footer > span{
    color:#91a4b0;
    font-size:9px;
    font-weight:700;
}

/*
   Give the preview card enough width to be genuinely useful while
   keeping Availability and Profile visible beside it.
*/
@media(min-width:1051px){
    .role-home-main-grid{
        grid-template-columns:
            minmax(560px,1.45fr)
            minmax(300px,.85fr)
            minmax(300px,.85fr);
    }
}

@media(max-width:1180px) and (min-width:761px){
    .role-home-opportunity-row{
        grid-template-columns:
            minmax(160px,1fr)
            90px
            62px;
    }

    .role-home-preview-status{
        grid-column:1 / -1;
        justify-self:start;
    }
}

@media(max-width:760px){
    .role-home-opportunity-row{
        grid-template-columns:1fr auto;
        gap:8px 12px;
    }

    .role-home-opportunity-main{
        grid-column:1 / -1;
    }

    .role-home-opportunity-start{
        grid-column:1;
    }

    .role-home-opportunity-match{
        grid-column:2;
    }

    .role-home-preview-status{
        grid-column:1 / -1;
        justify-self:start;
    }

    .role-home-opportunities-footer{
        align-items:flex-start;
        flex-direction:column;
    }
}


/* ==========================================================
   UNIFIED FLOORLAYER / COMPANY WORKSPACES V1
   ========================================================== */

.unified-workspace-page{
    max-width:1480px !important;
    padding-top:40px !important;
}

.unified-workspace-heading{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:28px;
    margin-bottom:22px;
}

.unified-workspace-heading > div:first-child{
    max-width:930px;
}

.unified-workspace-heading .lead{
    margin-bottom:0 !important;
}

.unified-workspace-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px !important;
    align-items:stretch;
}

.unified-workspace-grid .requirements-card{
    grid-column:1 / -1;
}

/*
   Floorlayer profile + availability form the compact utility row.
   Company overview sits above the full-width Jobs & Matches section.
*/
.unified-workspace-grid .dashboard-card:not(.requirements-card){
    min-height:190px;
}

/* V1.12.6: Compact and vertically balance the two floorlayer utility cards. */
body.floorlayer-workspace .unified-workspace-grid > .floorlayer-utility-card{
    min-height:148px;
    display:grid;
    grid-template-rows:auto minmax(0,1fr);
    padding:15px 20px !important;
}

body.floorlayer-workspace .floorlayer-utility-heading{
    min-height:40px;
}

body.floorlayer-workspace .floorlayer-utility-heading .button{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:40px !important;
    padding:0 16px !important;
    line-height:1.15 !important;
}

body.floorlayer-workspace .floorlayer-utility-content{
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:0;
    padding-top:5px;
}

body.floorlayer-workspace .floorlayer-utility-content > p{
    margin:3px 0 !important;
}

body.floorlayer-workspace .floorlayer-utility-content > .actions{
    margin-top:4px !important;
}

/* V1.12.7: Floorlayers may archive declined/completed items. */
.previous-job-row .archive-history,
.previous-heading .view-archive{
    min-height:30px;
    padding:5px 10px !important;
    border:1px solid #cfd9e0 !important;
    border-radius:999px !important;
    background:#fff !important;
    color:#092b43 !important;
    font-size:11px !important;
    font-weight:850 !important;
}

body.floorlayer-workspace .previous-job-row button.archive-history,
body.floorlayer-workspace .previous-heading a.view-archive{
    color:#092b43 !important;
    border-color:#8fb2c8 !important;
    background:#f7fafc !important;
    opacity:1 !important;
    -webkit-text-fill-color:#092b43 !important;
}

.previous-job-row .archive-history:hover,
.previous-heading .view-archive:hover{
    border-color:#d95b68 !important;
    color:#a62d3b !important;
    background:#fff5f6 !important;
}

body.floorlayer-workspace .previous-job-row button.archive-history:hover,
body.floorlayer-workspace .previous-heading a.view-archive:hover{
    color:#092b43 !important;
    border-color:#d2a94f !important;
    background:#fff8e8 !important;
    -webkit-text-fill-color:#092b43 !important;
}

/* V1.13.1: readable text on pale-green workspace confirmations. */
body.floorlayer-workspace .message.success,
body.floorlayer-workspace .alert.success{
    color:#092b43 !important;
    -webkit-text-fill-color:#092b43 !important;
    font-weight:700 !important;
    opacity:1 !important;
}

body.floorlayer-workspace .message.success *,
body.floorlayer-workspace .alert.success *{
    color:#092b43 !important;
    -webkit-text-fill-color:#092b43 !important;
}

.previous-heading-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex-wrap:wrap;
}

.unified-workspace-grid .jobs-matches-card{
    margin-top:0;
}

/* Make the full working sections feel like the main dashboard. */
.unified-workspace-grid .jobs-matches-card{
    padding:22px 24px !important;
}

.unified-workspace-grid .job-summary-grid{
    margin-top:16px;
}

/* Account/email duplication has been removed from the workspace.
   Keep profile and availability actions aligned neatly. */
.unified-workspace-grid .dashboard-card > .actions{
    margin-top:16px;
}

/* Dual-role switch remains visible beside the workspace label. */
.unified-workspace-heading .role-home-workspace-actions{
    flex:0 0 auto;
}

/*
   On a company workspace there is only one compact company-profile card
   before the full jobs section, so don't leave a mysterious half-empty row.
*/
.unified-workspace-page.company-dashboard-page
.unified-workspace-grid{
    grid-template-columns:minmax(0,1fr);
}

.unified-workspace-page.company-dashboard-page
.unified-workspace-grid
.company-overview-card{
    max-width:none;
    min-height:0;
}

/* The old separate Dashboard route is no longer part of the visible nav. */
.role-home-dashboard-link{
    display:none !important;
}

@media(max-width:900px){
    .unified-workspace-heading{
        flex-direction:column;
        gap:12px;
    }

    .unified-workspace-grid{
        grid-template-columns:1fr;
    }

    .unified-workspace-grid .requirements-card{
        grid-column:auto;
    }

    .unified-workspace-grid .dashboard-card:not(.requirements-card){
        min-height:0;
    }

    .unified-workspace-heading
    .role-home-workspace-actions{
        width:100%;
        justify-content:flex-start;
    }
}


/* ==========================================================
   COMPANY WORKSPACE + MATCH READABILITY V1
   ========================================================== */

/* Make the current workspace impossible to miss. */
.unified-workspace-heading .role-home-role-pill{
    min-height:44px !important;
    padding:0 18px !important;
    border-width:1px !important;
    border-color:rgba(210,169,79,.58) !important;
    background:rgba(210,169,79,.12) !important;
    font-size:13px !important;
    font-weight:950 !important;
    letter-spacing:.075em !important;
}

/* Potential Matches readability pass, especially for laptop screens. */
.job-detail-page .company-matches-card{
    padding:20px !important;
}

.job-detail-page .company-matches-card .job-section-heading h2{
    font-size:25px !important;
    line-height:1.15 !important;
}

.job-detail-page .company-matches-card .job-section-heading .small{
    font-size:12px !important;
    line-height:1.5 !important;
}

.job-detail-page .matches-heading-count{
    min-width:31px !important;
    height:31px !important;
    font-size:13px !important;
}

.job-detail-page .company-match-card{
    grid-template-columns:96px minmax(0,1fr) !important;
    gap:16px !important;
    padding:16px !important;
}

.job-detail-page .company-match-score{
    min-height:84px !important;
}

.job-detail-page .company-match-score span{
    font-size:30px !important;
}

.job-detail-page .company-match-score small{
    font-size:10px !important;
}

.job-detail-page .company-match-title-row h3{
    font-size:19px !important;
    line-height:1.2 !important;
}

.job-detail-page .company-match-title-row p{
    font-size:11px !important;
    line-height:1.4 !important;
}

.job-detail-page .candidate-match-status{
    min-height:30px !important;
    padding:6px 10px !important;
    font-size:10px !important;
}

.job-detail-page .candidate-key-facts{
    gap:8px 16px !important;
    margin-top:11px !important;
    font-size:11px !important;
    line-height:1.45 !important;
}

.job-detail-page .candidate-check{
    min-height:30px !important;
    padding:6px 9px !important;
    font-size:11px !important;
}

.job-detail-page .match-score-breakdown span{
    padding:9px 9px !important;
    font-size:10px !important;
}

.job-detail-page .match-score-breakdown strong{
    font-size:12px !important;
}

.job-detail-page .candidate-review-details summary{
    min-height:36px !important;
    padding:8px 12px !important;
    font-size:11px !important;
}

.job-detail-page .candidate-review-grid > div{
    padding:12px !important;
}

.job-detail-page .candidate-review-grid span,
.job-detail-page .match-reason-box > span{
    font-size:10px !important;
}

.job-detail-page .candidate-review-grid strong{
    font-size:13px !important;
    line-height:1.5 !important;
}

.job-detail-page .match-reason-box{
    padding:12px 14px !important;
}

.job-detail-page .match-reason-box ul{
    font-size:11px !important;
    line-height:1.65 !important;
}

.job-detail-page .candidate-contact-note{
    font-size:10px !important;
    line-height:1.5 !important;
}

.job-detail-page .introduction-request p,
.job-detail-page .introduction-waiting p,
.job-detail-page .introduction-unlocked p,
.job-detail-page .introduction-declined p{
    font-size:12px !important;
    line-height:1.55 !important;
}

.job-detail-page .intro-contact-grid span{
    font-size:10px !important;
}

.job-detail-page .intro-contact-grid a,
.job-detail-page .intro-contact-grid strong{
    font-size:12px !important;
}

/* A little more breathing room on ordinary laptops. */
@media(max-width:1280px) and (min-width:801px){
    .job-detail-page .company-match-card{
        grid-template-columns:88px minmax(0,1fr) !important;
        padding:14px !important;
    }

    .job-detail-page .candidate-key-facts{
        font-size:11px !important;
    }

    .job-detail-page .match-score-breakdown{
        gap:7px !important;
    }
}

@media(max-width:800px){
    .unified-workspace-heading .role-home-role-pill{
        min-height:40px !important;
        font-size:11px !important;
    }

    .job-detail-page .company-match-card{
        grid-template-columns:1fr !important;
    }
}

.role-home-role-pill.profile-active-pill {
    border-color: #1f9d72 !important;
    background: rgba(31, 157, 114, 0.16) !important;
    color: #bfffe7 !important;
}

input[type="date"] {
    max-width: 280px !important;
    color-scheme: dark !important;
}

input[type="date"] {
    max-width: 280px !important;
    color-scheme: dark !important;
    padding-right: 42px !important;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cline x1='16' y1='3' x2='16' y2='7'/%3E%3Cline x1='8' y1='3' x2='8' y2='7'/%3E%3Cline x1='3' y1='11' x2='21' y2='11'/%3E%3C/svg%3E") !important;

    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 16px 16px !important;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0 !important;
    cursor: pointer;
}
/* Phase 8 - only show rates for selected flooring skills */
.inline-skill-rate-row:not(.selected) .inline-rate-entry {
    display: none !important;
}

.inline-skill-rate-row.selected .inline-rate-entry {
    display: flex !important;
    align-items: center !important;
}

.inline-skill-rate-row .saved-default-rate {
    display: none !important;
}
.inline-skill-rate-row:not(.selected) {
    height: 52px !important;
    min-height: 52px !important;
    padding: 6px 12px !important;
    align-items: center !important;
}

.inline-skill-rate-row.selected {
    height: auto !important;
    min-height: 64px !important;
    padding: 10px 12px !important;
}
/* Phase 8 - compact Posting As card */
.summary-card.posting-card {
    padding:10px 15px !important;
}
/* Phase 8 - make Other match the normal skill rows */
.other-skill-rate-row:not(:has(input[type="checkbox"]:checked)) {
    height:52px !important;
    min-height:52px !important;
    padding:6px 12px !important;
    align-items:center !important;
}

.other-skill-rate-row:not(:has(input[type="checkbox"]:checked)) .other-skill-fields {
    display:none !important;
}

.other-skill-rate-row:has(input[type="checkbox"]:checked) {
    height:auto !important;
    min-height:64px !important;
    padding:10px 12px !important;
}

.other-skill-rate-row:has(input[type="checkbox"]:checked) .other-skill-fields {
    display:grid !important;
}
/* Dashboard button inside account top navigation */
.topnav a.button.secondary {
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    min-height:40px !important;
    padding:0 16px !important;

    border:1px solid var(--flc-blue-line) !important;
    border-radius:8px !important;
    background:var(--flc-blue-soft) !important;

    color:var(--flc-blue-text) !important;
    font-size:14px !important;
    font-weight:800 !important;
    text-decoration:none !important;

    box-sizing:border-box !important;
}

/* Match Dashboard and Sign out buttons */
.topnav > a.button.secondary,
.topnav > form .button.secondary {
    width:100px !important;
    min-width:100px !important;
    height:40px !important;
    padding:0 12px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    font-size:14px !important;
    font-weight:800 !important;
}
/* Keep Company / Office telephone dark when Chrome autofills it */
#company_phone {
    background:#0c2030 !important;
    color:#ffffff !important;
}

#company_phone:-webkit-autofill,
#company_phone:-webkit-autofill:hover,
#company_phone:-webkit-autofill:focus,
#company_phone:-webkit-autofill:active {
    -webkit-text-fill-color:#ffffff !important;
    -webkit-box-shadow:0 0 0 1000px #0c2030 inset !important;
    box-shadow:0 0 0 1000px #0c2030 inset !important;
    caret-color:#ffffff !important;
}
/* Keep company profile telephone and dropdown fields on the dark theme */
#company_phone,
select {
    background-color:#0c2030 !important;
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    color-scheme:dark !important;
}

/* Chrome autofill - Company / Office telephone */
#company_phone:-webkit-autofill,
#company_phone:-webkit-autofill:hover,
#company_phone:-webkit-autofill:focus,
#company_phone:-webkit-autofill:active {
    -webkit-text-fill-color:#ffffff !important;
    -webkit-box-shadow:0 0 0 1000px #0c2030 inset !important;
    box-shadow:0 0 0 1000px #0c2030 inset !important;
    caret-color:#ffffff !important;
}

/* Dropdown choices */
select option {
    background:#0c2030;
    color:#ffffff;
}
/* Company base - desktop 2 x 2 layout */
.company-base-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px 16px !important;
    align-items: start !important;
}

@media (max-width: 700px) {
    .company-base-grid {
        grid-template-columns: 1fr !important;
    }
}
/* iPhone Safari - prevent form focus zoom */
@media (max-width: 700px) {
    input,
    select,
    textarea {
        font-size: 16px !important;
    }
}
/* Mobile company workspace - force single-column layout */
@media (max-width:700px) {

    .company-dashboard-page .dashboard-grid,
    .unified-workspace-grid {
        grid-template-columns:1fr !important;
        width:100% !important;
        min-width:0 !important;
    }

    .company-dashboard-page .dashboard-card,
    .company-dashboard-page .company-overview-card,
    .company-dashboard-page .company-jobs-wide {
        grid-column:1 !important;
        width:100% !important;
        min-width:0 !important;
        max-width:100% !important;
        box-sizing:border-box !important;
    }
}/* Phase 8 - compact job duration preferences */
.duration-checks {
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:8px 18px !important;
}

.duration-checks .check {
    margin:0 !important;
}

@media (max-width:700px) {
    .duration-checks {
        grid-template-columns:1fr !important;
    }
}/* Phase 8 - compact professional checks */
.professional-checks {
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:8px 16px !important;
}

.professional-checks .check {
    margin:0 !important;
}

@media (max-width:700px) {
    .professional-checks {
        grid-template-columns:1fr !important;
    }
}

/* Phase 8 - compact travel preferences */
.travel-preference-checks {
    display:flex !important;
    flex-direction:column !important;
    gap:8px !important;
    justify-content:center !important;
}

.travel-preference-checks .check {
    margin:0 !important;
}

/* Phase 8 - qualifications spacing */
label[for="qualifications"] {
    display:block;
    margin-top:18px !important;
}

/* Phase 8 - compact profile text areas */
#qualifications {
    min-height:100px !important;
    height:100px !important;
    resize:vertical;
}

#additional_information {
    min-height:130px !important;
    height:130px !important;
    resize:vertical;
}

/* =========================================================
   IPHONE PORTRAIT - CURRENT OPPORTUNITIES
   Turn 7-column table into readable stacked cards
   ========================================================= */

@media screen and (max-width: 480px) and (orientation: portrait) {

    .jobs-table-wrap {
        width: 100% !important;
        overflow: visible !important;
    }

    .jobs-table.floorlayer-jobs-table {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        table-layout: auto !important;
    }

    .floorlayer-jobs-table thead {
        display: none !important;
    }

    .floorlayer-jobs-table tbody {
        display: block !important;
        width: 100% !important;
    }

    .floorlayer-jobs-table tbody tr {
        display: block !important;
        width: 100% !important;
        margin: 0 0 12px 0 !important;
        padding: 10px 12px !important;
        box-sizing: border-box !important;

        border: 1px solid rgba(255,255,255,.14) !important;
        border-radius: 10px !important;
        background: rgba(255,255,255,.025) !important;
    }

    .floorlayer-jobs-table tbody td {
        display: grid !important;
        grid-template-columns: 78px minmax(0, 1fr) !important;
        gap: 10px !important;

        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;

        padding: 6px 0 !important;
        border: 0 !important;

        font-size: 12px !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        overflow: visible !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
        text-align: left !important;
    }

    .floorlayer-jobs-table tbody td::before {
        font-size: 9px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: .04em !important;
        opacity: .65 !important;
    }

    .floorlayer-jobs-table tbody td:nth-child(1)::before {
        content: "Job";
    }

    .floorlayer-jobs-table tbody td:nth-child(2)::before {
        content: "Location";
    }

    .floorlayer-jobs-table tbody td:nth-child(3)::before {
        content: "Start";
    }

    .floorlayer-jobs-table tbody td:nth-child(4)::before {
        content: "Duration";
    }

    .floorlayer-jobs-table tbody td:nth-child(5)::before {
        content: "Rate";
    }

    .floorlayer-jobs-table tbody td:nth-child(6)::before {
        content: "Match";
    }

    .floorlayer-jobs-table tbody td:nth-child(7)::before {
        content: "Action";
    }

}

/* =========================================================
   IPHONE PORTRAIT - RESET OLD TABLE COLUMN WIDTHS
   ========================================================= */

@media screen and (max-width: 480px) and (orientation: portrait) {

    .jobs-table.floorlayer-jobs-table tbody tr > td,
    .jobs-table.floorlayer-jobs-table tbody tr > td:nth-child(1),
    .jobs-table.floorlayer-jobs-table tbody tr > td:nth-child(2),
    .jobs-table.floorlayer-jobs-table tbody tr > td:nth-child(3),
    .jobs-table.floorlayer-jobs-table tbody tr > td:nth-child(4),
    .jobs-table.floorlayer-jobs-table tbody tr > td:nth-child(5),
    .jobs-table.floorlayer-jobs-table tbody tr > td:nth-child(6),
    .jobs-table.floorlayer-jobs-table tbody tr > td:nth-child(7) {

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        float: none !important;
        position: static !important;

        display: grid !important;
        grid-template-columns: 72px minmax(0, 1fr) !important;

        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }

}

/* =========================================================
   IPHONE PORTRAIT - STRAIGHTEN OPPORTUNITY CARD
   ========================================================= */

@media screen and (max-width: 480px) and (orientation: portrait) {

    .jobs-table.floorlayer-jobs-table tbody td {
        grid-template-columns: 105px minmax(0, 1fr) !important;
        align-items: center !important;
        justify-content: normal !important;
        text-align: left !important;
    }

    .floorlayer-jobs-table tbody td::before {
        width: auto !important;
        margin: 0 !important;
        text-align: left !important;
        justify-self: start !important;
    }

    .floorlayer-jobs-table tbody td > * {
        margin-left: 0 !important;
        margin-right: 0 !important;
        justify-self: start !important;
        text-align: left !important;
    }

    .floorlayer-jobs-table tbody td:nth-child(6) > *,
    .floorlayer-jobs-table tbody td:nth-child(7) > * {
        justify-self: start !important;
        margin-left: 0 !important;
    }

}

/* IPHONE PORTRAIT - bring Withdraw closer to Interested */
@media screen and (max-width: 480px) and (orientation: portrait) {

    .floorlayer-jobs-table tbody td:nth-child(7) form + form {
        transform: translateX(-12px) !important;
    }

}

/* IPHONE PORTRAIT - keep Interested + Withdraw together */
@media screen and (max-width: 480px) and (orientation: portrait) {

    .floorlayer-jobs-table .progress-action {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 60px !important;
        width: auto !important;
    }

    .floorlayer-jobs-table .progress-action .action-state {
        flex: 0 0 auto !important;
        margin: 0 !important;
    }

    .floorlayer-jobs-table .progress-action form {
        flex: 0 0 auto !important;
        width: auto !important;
        margin: 0 !important;
    }

}

/* =========================================================
   IPHONE PORTRAIT - COMPANY LIVE JOBS
   Turn company jobs table into stacked cards
   ========================================================= */

@media screen and (max-width: 480px) and (orientation: portrait) {

    .company-dashboard-page .jobs-table-wrap {
        width: 100% !important;
        overflow: visible !important;
    }

    .company-dashboard-page .jobs-table:not(.floorlayer-jobs-table) {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        table-layout: auto !important;
    }

    .company-dashboard-page .jobs-table:not(.floorlayer-jobs-table) thead {
        display: none !important;
    }

    .company-dashboard-page .jobs-table:not(.floorlayer-jobs-table) tbody {
        display: block !important;
        width: 100% !important;
    }

    .company-dashboard-page .jobs-table:not(.floorlayer-jobs-table) tbody tr {
        display: block !important;
        width: 100% !important;
        margin: 0 0 12px 0 !important;
        padding: 12px !important;
        box-sizing: border-box !important;

        border: 1px solid rgba(255,255,255,.14) !important;
        border-radius: 10px !important;
        background: rgba(255,255,255,.025) !important;
    }

    .company-dashboard-page .jobs-table:not(.floorlayer-jobs-table) tbody td {
        display: grid !important;
        grid-template-columns: 95px minmax(0,1fr) !important;
        gap: 10px !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        padding: 7px 0 !important;
        border: 0 !important;

        text-align: left !important;
        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
    }

    .company-dashboard-page .jobs-table:not(.floorlayer-jobs-table) tbody td::before {
        content: attr(data-label) !important;

        font-size: 9px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: .04em !important;
        opacity: .65 !important;

        text-align: left !important;
    }

    .company-dashboard-page .jobs-table:not(.floorlayer-jobs-table) tbody td > * {
        justify-self: start !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left !important;
    }

}

/* Yellow Sign in action */
.topnav .signin-top{
    background:#f8c745;
    color:#101d2d !important;
    padding:9px 14px;
    border-radius:7px;
    font-weight:800;
}
/* ==========================================================
   WORKSPACE HOME LINK
   ========================================================== */

.topnav .home-link{
    display:inline-flex;
    align-items:center;
    gap:7px;
    position:relative;

    font-size:16px;
    font-weight:700;
    color:#ffffff;
}

.topnav .home-link::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-9px;
    height:3px;
    border-radius:3px;
    background:var(--gold);
    transform:scaleX(0);
    transform-origin:left center;
    transition:transform .18s ease;
}

.topnav .home-link .home-icon{
    font-size:18px;
    line-height:1;
}

/* V1.12.4: Retain the Home navigation link without the decorative house emoji. */
.topnav .home-link .home-icon{
    display:none;
}

.topnav .home-link:hover{
    color:var(--gold);
}

.topnav .home-link:hover::after,
.topnav .home-link:focus-visible::after{
    transform:scaleX(1);
}
/* ==========================================================
   FLOORLAYER CONNECT
   COMPANY WORKSPACE - CORPORATE V1
   ========================================================== */

/* ----------------------------------------------------------
   1. COMPANY ENVIRONMENT
   The image will appear automatically when this file exists:
   /assets/company-workspace-showroom.webp
   ---------------------------------------------------------- */

body.company-workspace{
    min-height:100vh;

    background:
        linear-gradient(
            rgba(239,244,248,.65),
            rgba(239,244,248,.65)
        ),
        url("../assets/company-workspace-showroom.png")
        center center / cover fixed no-repeat !important;

    color:#10263a !important;
}

/* ----------------------------------------------------------
   2. CORPORATE TOP BAR
   ---------------------------------------------------------- */

body.company-workspace .topbar{
    background:
        linear-gradient(
            90deg,
            #041725 0%,
            #06263f 100%
        ) !important;

    border-bottom:1px solid rgba(210,169,79,.45) !important;
    box-shadow:0 6px 24px rgba(4,23,37,.18);
}

body.company-workspace .brand{
    color:#ffffff !important;
}
/* Narrow company welcome panel - definite target */
body.company-workspace
.company-dashboard-page
.unified-workspace-heading{
    width:72% !important;
    max-width:980px !important;
    margin-left:0 !important;
    margin-right:auto !important;
}


body.company-workspace .brand span{
    color:#d2a94f !important;
}

body.company-workspace .topnav a{
    color:#ffffff;
}


/* ----------------------------------------------------------
   3. MAIN COMPANY CANVAS
   ---------------------------------------------------------- */

body.company-workspace .company-dashboard-page{
    width:100%;
    max-width:1480px !important;
    padding-top:34px !important;
    padding-bottom:80px !important;

    color:#10263a !important;
}


/* ----------------------------------------------------------
   4. COMPANY WORKSPACE HEADER
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.unified-workspace-heading{

    position:relative;
    overflow:hidden;

    padding:28px 30px;
    margin-bottom:22px;

    background:
        linear-gradient(
            120deg,
            rgba(4,23,37,.97),
            rgba(8,48,78,.94)
        );

    border:1px solid rgba(210,169,79,.30);
    border-radius:18px;

    box-shadow:
        0 14px 38px rgba(5,28,46,.18);

    color:#ffffff;
}

body.company-workspace
.company-dashboard-page
.unified-workspace-heading::after{

    content:"";
    position:absolute;

    left:30px;
    bottom:0;

    width:90px;
    height:4px;

    background:#d2a94f;
    border-radius:4px 4px 0 0;
}

body.company-workspace
.company-dashboard-page
.unified-workspace-heading .eyebrow{

    color:#d2a94f !important;
    font-weight:900;
    letter-spacing:.14em;
}

body.company-workspace
.company-dashboard-page
.unified-workspace-heading h1{

    color:#ffffff !important;
    margin-top:4px;
    margin-bottom:8px;
    letter-spacing:-.025em;
}

body.company-workspace
.company-dashboard-page
.unified-workspace-heading .lead{

    color:#d7e2ea !important;
    max-width:760px;
    line-height:1.5;
}


/* ----------------------------------------------------------
   5. COMPANY WORKSPACE LABEL
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.role-home-role-pill{

    background:#d2a94f !important;
    border:1px solid #e5c46f !important;

    color:#071827 !important;

    min-height:42px !important;
    padding:0 18px !important;

    box-shadow:0 7px 18px rgba(0,0,0,.16);

    font-size:11px !important;
    font-weight:950 !important;
    letter-spacing:.08em !important;
}

body.company-workspace
.company-dashboard-page
.workspace-switch-button{

    background:rgba(255,255,255,.08) !important;
    border-color:rgba(255,255,255,.24) !important;
    color:#ffffff !important;
}

body.company-workspace
.company-dashboard-page
.workspace-switch-button:hover{

    background:rgba(255,255,255,.16) !important;
    border-color:#d2a94f !important;
}


/* ----------------------------------------------------------
   6. CORPORATE DASHBOARD CARDS
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.dashboard-card{

    background:rgba(255,255,255,.94) !important;

    border:1px solid rgba(17,55,82,.13) !important;
    border-radius:16px !important;

    box-shadow:
        0 12px 30px rgba(7,34,53,.10) !important;

    color:#183044 !important;

    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

body.company-workspace
.company-dashboard-page
.dashboard-card:hover{

    border-color:rgba(210,169,79,.42) !important;

    box-shadow:
        0 16px 36px rgba(7,34,53,.14) !important;
}

body.company-workspace
.company-dashboard-page
.dashboard-card h2{

    color:#09243b !important;

    font-weight:900;
    letter-spacing:-.02em;
}

body.company-workspace
.company-dashboard-page
.dashboard-card h3{

    color:#17334a !important;
}

body.company-workspace
.company-dashboard-page
.dashboard-card p{

    color:#445d70;
}

body.company-workspace
.company-dashboard-page
.dashboard-card .small{

    color:#607486 !important;
}

body.company-workspace
.company-dashboard-page
.dashboard-card strong{

    color:#102a40;
}


/* ----------------------------------------------------------
   7. COMPANY PROFILE CARD
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.company-overview-card{

    position:relative;

    border-left:5px solid #d2a94f !important;

    padding:24px 26px !important;
}

body.company-workspace
.company-dashboard-page
.company-overview-card::before{

    content:"COMPANY PROFILE";

    display:inline-block;

    margin-bottom:10px;

    color:#9a771f;

    font-size:10px;
    font-weight:950;
    letter-spacing:.13em;
}


/* ----------------------------------------------------------
   8. BUTTON HIERARCHY
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.button{

    background:#092a43 !important;
    border:1px solid #092a43 !important;

    color:#ffffff !important;

    border-radius:9px !important;

    font-weight:850 !important;

    box-shadow:
        0 6px 14px rgba(5,31,50,.13);
}

body.company-workspace
.company-dashboard-page
.button:hover{

    background:#104266 !important;
    border-color:#104266 !important;

    transform:translateY(-1px);
}

body.company-workspace
.company-dashboard-page
.button.secondary{

    background:#ffffff !important;

    border:1px solid #cbd6df !important;

    color:#123049 !important;

    box-shadow:none;
}

body.company-workspace
.company-dashboard-page
.button.secondary:hover{

    background:#f4f7f9 !important;

    border-color:#9fb2c1 !important;

    color:#061b33 !important;
}


/* Main company action */

body.company-workspace
.company-dashboard-page
.company-jobs-wide
.card-heading-row > .button{

    background:
        linear-gradient(
            90deg,
            #c99d3d,
            #e0bd68
        ) !important;

    border-color:#c89c3e !important;

    color:#071827 !important;

    box-shadow:
        0 8px 18px rgba(151,111,28,.20);
}

body.company-workspace
.company-dashboard-page
.company-jobs-wide
.card-heading-row > .button:hover{

    filter:brightness(1.04);

    transform:translateY(-1px);
}


/* ----------------------------------------------------------
   9. JOBS & MATCHES MAIN PANEL
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.company-jobs-wide{

    border-top:4px solid #d2a94f !important;

    padding:25px 27px !important;
}

body.company-workspace
.company-dashboard-page
.company-jobs-wide
.card-heading-row{

    padding-bottom:4px;
}

body.company-workspace
.company-dashboard-page
.company-jobs-wide
.card-heading-row h2{

    font-size:23px !important;
}


/* ----------------------------------------------------------
   10. KPI / JOB SUMMARY CARDS
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.job-summary-grid{

    gap:14px !important;
}

body.company-workspace
.company-dashboard-page
.job-summary{

    position:relative;

    min-height:92px !important;

    padding:16px 18px !important;

    background:#f8fafc !important;

    border:1px solid #dbe3e9 !important;
    border-radius:13px !important;

    box-shadow:
        0 5px 14px rgba(10,43,66,.055);

    overflow:hidden;
}

body.company-workspace
.company-dashboard-page
.job-summary::before{

    content:"";

    position:absolute;

    top:0;
    left:0;

    width:4px;
    height:100%;

    background:#d2a94f;
}

body.company-workspace
.company-dashboard-page
.job-summary-number{

    color:#082c47 !important;

    font-size:32px !important;
    font-weight:950 !important;

    letter-spacing:-.04em;
}

body.company-workspace
.company-dashboard-page
.job-summary-label{

    color:#667988 !important;

    font-size:10px !important;
    font-weight:900 !important;

    text-transform:uppercase;
    letter-spacing:.07em;
}


/* ----------------------------------------------------------
   11. JOB SECTION HEADINGS
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.jobs-section-heading{

    margin-top:22px;

    padding-bottom:9px;

    border-bottom:1px solid #dde5eb;
}

body.company-workspace
.company-dashboard-page
.jobs-section-heading h3{

    color:#092a43 !important;

    font-weight:900;
}


/* ----------------------------------------------------------
   12. CORPORATE JOB TABLE
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.jobs-table-wrap{

    overflow:hidden;

    background:rgba(255,255,255,.96) !important;

    border:1px solid #d6e0e7 !important;
    border-radius:12px !important;

    box-shadow:
        0 5px 15px rgba(8,42,65,.05);
}

body.company-workspace
.company-dashboard-page
.jobs-table{

    background:#ffffff;
}

body.company-workspace
.company-dashboard-page
.jobs-table th{

    background:#092a43 !important;

    border-bottom:0 !important;

    color:#ffffff !important;

    font-size:10px !important;
    font-weight:900 !important;

    letter-spacing:.08em !important;
}

body.company-workspace
.company-dashboard-page
.jobs-table td{

    background:#ffffff;

    border-bottom:1px solid #e5ebef !important;

    color:#2f485a !important;

    font-size:13px;
}

body.company-workspace
.company-dashboard-page
.jobs-table tbody tr:hover td{

    background:#f6f9fb !important;
}

body.company-workspace
.company-dashboard-page
.dashboard-job-link{

    color:#092f4c !important;
    font-weight:900 !important;
}

body.company-workspace
.company-dashboard-page
.dashboard-job-link:hover{

    color:#a97d1c !important;
}


/* ----------------------------------------------------------
   13. MATCH COUNTS
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.match-count{

    background:#eef4f8 !important;

    border:1px solid #b9cad7 !important;

    color:#0a3758 !important;
}

body.company-workspace
.company-dashboard-page
.match-count:hover{

    background:#d2a94f !important;

    border-color:#d2a94f !important;

    color:#071827 !important;
}


/* ----------------------------------------------------------
   14. EMPTY STATES / INFORMATION
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.empty-state{

    background:#f5f8fa !important;

    border:1px dashed #c5d1da !important;

    color:#536a7b !important;
}

body.company-workspace
.company-dashboard-page
.empty-state strong{

    color:#17354b !important;
}


/* ----------------------------------------------------------
   15. MESSAGES
   ---------------------------------------------------------- */

body.company-workspace
.company-dashboard-page
.message{

    border-radius:12px !important;

    box-shadow:
        0 7px 18px rgba(7,38,59,.07);
}


/* ----------------------------------------------------------
   16. RESPONSIVE COMPANY WORKSPACE
   ---------------------------------------------------------- */

@media(max-width:900px){

    body.company-workspace{
        background-attachment:scroll !important;
    }

    body.company-workspace
    .company-dashboard-page{

        padding-top:24px !important;
    }

    body.company-workspace
    .company-dashboard-page
    .unified-workspace-heading{

        padding:22px 20px;
        border-radius:14px;
    }

    body.company-workspace
    .company-dashboard-page
    .job-summary-grid{

        grid-template-columns:
            repeat(2,minmax(0,1fr)) !important;
    }

    body.company-workspace
    .company-dashboard-page
    .company-jobs-wide{

        padding:18px !important;
    }
}

@media(max-width:560px){

    body.company-workspace
    .company-dashboard-page
    .job-summary-grid{

        grid-template-columns:1fr !important;
    }
}


/* ==========================================================
   END COMPANY WORKSPACE - CORPORATE V1
   ========================================================== */
/* ==========================================================
   COMPANY NAME ON SHOWROOM WALL
   ========================================================== */

body.company-workspace .company-dashboard-page{
    position:relative !important;
}

/* Leave the showroom wall visible on desktop */
body.company-workspace .company-workspace-hero{
    width:calc(100% - 390px) !important;
    max-width:1050px !important;
}

/* Dynamic subscriber company name */
body.company-workspace .company-wall-name{
    position:absolute;
    top:58px;
    right:38px;
    z-index:5;

    width:330px;

    color:#092a43;
    text-align:center;
    text-transform:uppercase;

    font-size:27px;
    line-height:1.12;
    font-weight:900;
    letter-spacing:.035em;

    text-shadow:0 1px 0 rgba(255,255,255,.65);
}

body.company-workspace .company-wall-name::after{
    content:"";
    display:block;

    width:110px;
    height:3px;

    margin:12px auto 0;

    border-radius:99px;
    background:#d2a94f;
}

@media(max-width:1100px){
    body.company-workspace .company-workspace-hero{
        width:100% !important;
        max-width:none !important;
    }

    body.company-workspace .company-wall-name{
        display:none;
    }
}
/* Hide duplicate company name inside navy hero */
body.company-workspace
.company-workspace-hero
.company-wall-name{
    display:none !important;
}

/* Company registration page */
body:has(.registration-card){
    background:#eef2f5;
    color:#10283b;
    font-family:"Segoe UI",Arial,Helvetica,sans-serif;
}
body:has(.registration-card) .topbar{
    box-shadow:0 6px 22px rgba(7,24,39,.15);
}
body:has(.registration-card) .page{
    max-width:1120px;
    padding-top:48px;
    padding-bottom:58px;
}
body:has(.registration-card) h1{
    color:#071827;
    max-width:900px;
    font-weight:700;
}
body:has(.registration-card) .lead{
    color:#425766;
    max-width:900px;
}
.registration-card{
    background:#ffffff;
    color:#10283b;
    border:1px solid #cbd8e1;
    border-top:3px solid #d2a94f;
    box-shadow:0 24px 60px rgba(7,24,39,.18);
}
.registration-grid{
    gap:20px;
}
.form-section{
    padding:0 0 8px;
}
.form-section-heading{
    display:flex;
    align-items:flex-start;
    gap:14px;
    margin:2px 0 18px;
}
.form-section-heading h2{
    margin:0 0 5px;
    font-size:23px;
    line-height:1.2;
    font-weight:700;
    color:#10283b;
}
.form-section-heading p{
    margin:0;
    color:#506879;
    font-size:13px;
}
.form-step{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    flex:0 0 34px;
    border-radius:50%;
    background:var(--gold);
    color:var(--navy);
    font-size:12px;
    font-weight:800;
}
.contact-heading{
    margin-top:8px;
    padding-top:24px;
    border-top:1px solid #d7e1e8;
}
.section-grid{
    width:100%;
}
.address-heading{
    margin-top:4px;
    padding-top:18px;
    border-top:1px solid #d7e1e8;
}
.address-heading h3{
    margin:0 0 4px;
    font-size:17px;
    font-weight:700;
    color:#10283b;
}

body:has(.registration-card) label.field{
    font-size:15px;
    font-weight:600;
    color:#10283b;
}
body:has(.registration-card) .check{
    font-size:15px;
    font-weight:400;
}
body:has(.registration-card) .check strong{
    font-weight:600;
}
body:has(.registration-card) .button{
    font-weight:700;
}
body:has(.registration-card) .help,
body:has(.registration-card) .address-heading p{
    font-size:13px;
}
body:has(.registration-card) .form-section-heading p{
    font-size:14px;
}
.address-heading h3 span{
    margin-left:7px;
    color:#607686;
    font-size:11px;
    font-weight:500;
}
.address-heading p{
    margin:0;
    color:#607686;
    font-size:12px;
}
.registered-office-control{
    margin-top:4px;
    padding:14px 16px;
    border:1px solid rgba(201,164,92,.34);
    border-radius:10px;
    background:#fff9e9;
}
.registered-same-check{
    margin:0;
}
.registered-office-panel{
    padding:18px;
    border:1px solid #d7e1e8;
    border-radius:12px;
    background:#f6f9fb;
}
.registered-office-panel[hidden]{
    display:none !important;
}
.company-inline-details{
    padding:18px;
    border:1px solid rgba(201,164,92,.34);
    border-radius:12px;
    background:#fff9e9;
}
.role-box-compact{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:12px 14px;
}
.role-box-compact .role-heading{
    margin:0;
    align-items:center;
}
.role-box-compact .role-heading strong{
    font-size:13px;
}
.role-box-compact .role-help,
.role-box-compact .role-choice-text,
.role-box-compact .role-change-link{
    display:none;
}
.role-box-compact .role-choice-grid{
    margin-left:auto;
}
.role-box-compact .role-choice-card-fixed{
    min-height:0;
    padding:9px 14px 9px 42px;
    border-radius:9px;
}
.role-box-compact .role-fixed-check{
    left:11px;
    width:22px;
    height:22px;
    font-size:14px;
}
.role-box-compact .role-choice-title{
    font-size:14px;
}
.security-notice{
    display:flex;
    align-items:flex-start;
    gap:9px;
    padding:12px 14px;
    border-radius:10px;
    background:rgba(0,136,206,.09);
    border:1px solid rgba(0,136,206,.26);
    color:#dceaf2;
    font-size:12px;
    line-height:1.5;
}

/* Registration form readability and account-creation clarity. */
body:has(.registration-card) .registration-card input:not([type="checkbox"]):not([type="radio"]),
body:has(.registration-card) .registration-card select,
body:has(.registration-card) .registration-card textarea{
    background:#f5f8fa;
    border-color:#bfd0dc;
    color:#0b2d45;
}
body:has(.registration-card) .registration-card select option{
    background:#ffffff;
    color:#0b2d45;
}
body:has(.registration-card) .registration-card input::placeholder,
body:has(.registration-card) .registration-card textarea::placeholder{
    color:#657b8b;
    opacity:1;
}
body:has(.registration-card) .security-notice{
    background:#eaf4fa;
    border-color:#9fc6dc;
    color:#153c55;
    font-size:14px;
}
body:has(.registration-card) .security-notice span,
body:has(.registration-card) .security-notice strong{
    color:#153c55;
}
body:has(.registration-card) .check{
    color:#18384d;
    padding:12px 14px;
    border:1px solid #d7e3ea;
    border-radius:9px;
    background:#ffffff;
}
body:has(.registration-card) .checks{
    gap:10px;
    padding:16px;
    border:1px solid #bed4e1;
    border-radius:12px;
    background:#f2f7fa;
}
body:has(.registration-card) .check input[type="checkbox"]{
    width:18px;
    height:18px;
    flex:0 0 18px;
    accent-color:#0b4f75;
}
body:has(.registration-card) .check a{
    color:#075985;
    text-decoration:underline;
}
body:has(.registration-card) .message.error{
    background:#fdebec;
    border-color:#e6a3a7;
    color:#8f1f29;
    font-size:15px;
    font-weight:700;
}
body:has(.registration-card) .password-generator{
    background:#fff8e5;
    border-color:#d2a94f;
    color:#10283b;
}
body:has(.registration-card) .role-box{
    background:#f6f9fb;
    border-color:#cbd8e1;
}
body:has(.registration-card) .role-choice-card{
    background:#ffffff;
    border-color:#cbd8e1;
}
body:has(.registration-card) .role-choice-title{
    color:#10283b;
}
body:has(.registration-card) .role-choice-text,
body:has(.registration-card) .role-help,
body:has(.registration-card) .role-change-link{
    color:#506879;
}
body:has(.registration-card) .divider{
    border-top-color:#d7e1e8;
}
body:has(.registration-card) .help{
    color:#2f536b;
    font-size:13.5px;
    font-weight:500;
}
body:has(.registration-card) .form-section-heading p,
body:has(.registration-card) .address-heading p,
body:has(.registration-card) .role-choice-text,
body:has(.registration-card) .role-help,
body:has(.registration-card) .role-change-link{
    color:#2f536b;
}
body:has(.registration-card) .topnav .signin-top{
    min-width:96px;
    padding:12px 20px;
    font-size:16px;
    line-height:1.2;
    text-align:center;
}
.account-footer{
    background:#071827;
    color:#fff;
    border-top:3px solid #c9a45c;
}
.account-footer-inner{
    max-width:1120px;
    margin:0 auto;
    padding:26px 24px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:22px;
}
.account-footer strong{
    display:block;
    font-size:15px;
    letter-spacing:.04em;
}
.account-footer strong span{
    color:#c9a45c;
}
.account-footer small{
    display:block;
    margin-top:5px;
    color:#aebbc5;
}
.account-footer nav{
    display:flex;
    flex-wrap:wrap;
    gap:16px;
}

/* ==========================================================
   REGISTRATION PAGE — CONSOLIDATED READABILITY V1.9.8
   ========================================================== */
body:has(.registration-card) .registration-card input:not([type="checkbox"]):not([type="radio"]),
body:has(.registration-card) .registration-card select,
body:has(.registration-card) .registration-card textarea{
    background:#f5f8fa !important;
    border:1px solid #b9ccd9 !important;
    color:#092f4b !important;
    font-size:15px !important;
    font-weight:400 !important;
}

body:has(.registration-card) .registration-card select{
    color-scheme:light !important;
    color:#092f4b !important;
    -webkit-text-fill-color:#092f4b !important;
    opacity:1 !important;
}

body:has(.registration-card) .registration-card select option,
body:has(.registration-card) .registration-card select option[value=""]{
    background:#ffffff !important;
    color:#092f4b !important;
    -webkit-text-fill-color:#092f4b !important;
    opacity:1 !important;
}

body:has(.registration-card) .registration-card select:disabled{
    background:#edf3f6 !important;
    color:#092f4b !important;
    -webkit-text-fill-color:#092f4b !important;
    opacity:1 !important;
}

body:has(.registration-card) .registration-card label.field{
    color:#102f46 !important;
    font-size:14px !important;
    font-weight:650 !important;
}

body:has(.registration-card) .registration-card .help,
body:has(.registration-card) .registration-card .small,
body:has(.registration-card) .registration-card .form-section-heading p,
body:has(.registration-card) .registration-card .address-heading p{
    color:#35566d !important;
    font-size:13px !important;
    line-height:1.45 !important;
}

body:has(.registration-card) .registration-card .actions{
    align-items:center !important;
    gap:16px !important;
}

body:has(.registration-card) .registration-card .actions .small{
    font-size:14px !important;
    font-weight:500 !important;
}

body:has(.registration-card) .registration-card .actions .small a{
    color:#075985 !important;
    font-size:15px !important;
    font-weight:750 !important;
    text-decoration:underline !important;
}

body:has(.registration-card) .security-notice,
body:has(.registration-card) .security-notice span{
    color:#153c55 !important;
}

body:has(.registration-card) .checks .check,
body:has(.registration-card) .checks .check span{
    color:#18384d !important;
}

/* Clear registration identity without repeating an account-type panel. */
body:has(.registration-card) .registration-eyebrow{
    color:#b88418 !important;
    font-size:15px !important;
    line-height:1.3 !important;
    font-weight:850 !important;
    letter-spacing:.12em !important;
    margin-bottom:9px !important;
}

body:has(.registration-card) .role-box-compact{
    display:none !important;
}
.account-footer a{
    color:#dce6ec;
    font-size:12px;
    text-decoration:none;
}
.account-footer a:hover{
    color:#fff;
    text-decoration:underline;
}

@media(max-width:760px){
    body:has(.registration-card) .page{
        padding-top:34px;
    }
    .role-box-compact,
    .account-footer-inner{
        align-items:flex-start;
        flex-direction:column;
    }
    .role-box-compact .role-choice-grid{
        width:100%;
        margin-left:0;
    }
    .role-box-compact .role-choice-card-fixed{
        width:100%;
    }
    .registered-office-panel{
        padding:15px;
    }
}


/* Silver identity for floorlayer account pages. Company retains gold. */
html body.floorlayer-workspace .eyebrow,
html body.floorlayer-workspace .floorlayer-workspace-hero .eyebrow,
html body.floorlayer-account-page .eyebrow { color:#d5dae0 !important; }
html body.floorlayer-workspace .topbar { border-bottom-color:#c7ccd1 !important; }
html body.floorlayer-workspace .dashboard-card,
html body.floorlayer-workspace .card,
html body.floorlayer-workspace .archive-card,
html body.floorlayer-account-page .card,
html body.floorlayer-account-page .floorlayer-account-summary {
    border-color:#c7ccd1 !important; border-top-color:#c7ccd1 !important;
    box-shadow:0 0 0 1px rgba(199,204,209,.35),0 8px 22px rgba(156,165,175,.24) !important;
}
html body.floorlayer-workspace .floorlayer-workspace-hero {
    border-color:#c7ccd1 !important;
    box-shadow:0 0 0 1px rgba(199,204,209,.3),0 10px 28px rgba(156,165,175,.35) !important;
}
html body.floorlayer-workspace .jobs-table-wrap,
html body.floorlayer-workspace .previous-job-row,
html body.floorlayer-workspace .floorlayer-contact-card {
    border-color:#c7ccd1 !important; box-shadow:0 3px 10px rgba(156,165,175,.18);
}
/* Dark silver on pale pages; light silver on navy preserves legibility. */
html body.floorlayer-account-page .eyebrow,
html body.floorlayer-workspace .archive-hero .eyebrow,
html body.floorlayer-workspace main > .eyebrow { color:#65717d !important; }
html body a[href="home.php?workspace=floorlayer"],
html body a[href="/account/home.php?workspace=floorlayer"] { color:#65717d !important; }
html body .topbar a[href*="workspace=floorlayer"],
html body .unified-workspace-heading a[href*="workspace=floorlayer"] { color:#d5dae0 !important; -webkit-text-fill-color:#d5dae0 !important; }
html body.floorlayer-workspace .topnav .workspace-pill:hover,
html body.floorlayer-account-page .topnav .workspace-pill:hover { border-color:#c7ccd1 !important; box-shadow:inset 0 -3px 0 #c7ccd1 !important; }
/* Organisation-based company pricing fields — launch update 22 September 2026. */
.organisation-pricing-heading{
    margin-top:8px;
    padding-top:22px;
    border-top:1px solid #c9d6df;
}
.organisation-pricing-heading h3{
    margin:0 0 7px;
    color:#092b43;
    font-size:19px;
}
.organisation-pricing-heading p{
    max-width:760px;
    margin:0;
    color:#466175;
    line-height:1.55;
}
.organisation-plan-preview{
    display:grid;
    gap:5px;
    padding:16px 18px;
    border:1px solid #b88a25;
    border-left:5px solid #d8ae4b;
    border-radius:9px;
    background:#fff8e5;
}
.organisation-plan-preview span{
    color:#5f4a17;
    font-size:12px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
}
.organisation-plan-preview strong{
    color:#092b43;
    font-size:22px;
}
.organisation-plan-preview small{
    color:#466175;
    font-size:13px;
    line-height:1.5;
}
.organisation-scope-confirmation{
    align-items:flex-start;
    padding:14px 16px;
    border:1px solid #aabcc8;
    border-radius:9px;
    background:#f4f8fa;
}
.organisation-scope-confirmation span{
    color:#27465a;
    line-height:1.5;
}
.company-pricing-summary-note{
    margin:16px 0 0;
    padding:13px 15px;
    border-left:4px solid #d8ae4b;
    background:#fff8e5;
    color:#38566d;
    font-size:13px;
    line-height:1.55;
}
