/* =========================================================
   AdeaFiber Billing - Classic Modern V2
   Vetem dizajn. Logjika e aplikacionit nuk ndryshohet.
   ========================================================= */

:root{
    --page:#eef2f6;
    --card:#ffffff;
    --card-soft:#f8fafc;
    --line:#d9e1e8;
    --line-strong:#c6d1dc;
    --text:#263442;
    --muted:#6e7d8b;
    --blue:#3f79ad;
    --blue-dark:#2f628f;
    --blue-soft:#eaf2f8;
    --green:#4d8b63;
    --red:#b95656;
    --shadow:0 6px 20px rgba(37,52,66,.08);
    --radius:10px;
}

*{box-sizing:border-box}

html,body{
    margin:0;
    padding:0;
}

body{
    background:var(--page);
    color:var(--text);
    font-family:Verdana,Arial,Helvetica,sans-serif;
    font-size:12px;
    line-height:1.5;
    padding:18px;
}

/* ---------- Common page shell ---------- */
body.classic-modern{
    background:var(--page);
}

.classic-page{
    max-width:1180px;
    margin:0 auto;
}

.classic-card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
    padding:16px;
    margin-bottom:14px;
}

.classic-title{
    font-size:17px;
    font-weight:bold;
    color:#23384b;
    margin:0 0 14px 0;
}

.classic-subtitle{
    color:var(--muted);
    font-size:11px;
}

/* ---------- Links ---------- */
a{
    color:#245d8d;
    text-decoration:none;
    transition:all .15s ease;
}
a:visited{color:#245d8d}
a:hover{
    color:#143f64;
    text-decoration:none;
}

/* ---------- Classic top navigation ---------- */
.classic-nav{
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
    padding:10px 12px;
    margin-bottom:14px;
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    align-items:center;
}
.classic-nav a,
.classic-nav .active{
    display:inline-block;
    padding:7px 10px;
    border:1px solid var(--line);
    border-radius:6px;
    background:#f9fbfc;
    color:#31485c;
    font-weight:bold;
}
.classic-nav a:hover{
    background:var(--blue-soft);
    border-color:#bfd0df;
}
.classic-nav .active{
    background:#e8f0f6;
    color:#234b6d;
}

/* ---------- Tables ---------- */
table{
    font-family:Verdana,Arial,Helvetica,sans-serif;
    color:var(--text);
}

table[border="1"]{
    border:1px solid var(--line)!important;
    background:#fff;
    border-radius:8px;
    overflow:hidden;
    box-shadow:var(--shadow);
}

table[border="1"] td,
table[border="1"] th{
    border-color:var(--line)!important;
}

td{
    padding:6px 8px;
}

th{
    padding:8px 9px!important;
    border-collapse:collapse;
    border-color:var(--line)!important;
    border-width:1px;
    background:#e9eff4!important;
    color:#2b4257!important;
    font-weight:bold!important;
    text-align:left;
}

tr:hover td{
    background-color:rgba(232,240,246,.45);
}

/* Legacy row colors softened */
td[bgcolor="#C0C0C0"], td[bgcolor="#c0c0c0"]{
    background:#e8edf2!important;
}
table[bgcolor="#CCCCFF"], table[bgcolor="#ccccff"],
body[bgcolor="#CCCCFF"], body[bgcolor="#ccccff"]{
    background:transparent!important;
}
tr[bgcolor="#CCCCFF"], tr[bgcolor="#ccccff"]{
    background:#f8fafc!important;
}
tr[bgcolor="#DDDDFF"], tr[bgcolor="#ddddff"]{
    background:#fff!important;
}
tr[bgcolor="#CFCFCF"], tr[bgcolor="#cfcfcf"]{
    background:#f6f8fa!important;
}
tr[bgcolor="#DFDFDF"], tr[bgcolor="#dfdfdf"]{
    background:#fff!important;
}
tr[bgcolor="#999966"], tr[bgcolor="#999966"] td{
    background:#e4eaf0!important;
    color:#263b4e!important;
}

/* ---------- Forms ---------- */
input[type="text"],
input[type="password"],
input[type="number"],
select,
textarea{
    border:1px solid #bcc8d3!important;
    border-radius:6px!important;
    background:#fff!important;
    color:#263746!important;
    padding:7px 9px!important;
    min-height:34px;
    font-family:Verdana,Arial,sans-serif!important;
    font-size:12px!important;
    outline:none;
    transition:border-color .15s ease, box-shadow .15s ease;
}

textarea{
    min-height:80px;
    resize:vertical;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
select:focus,
textarea:focus{
    border-color:#6e9bc1!important;
    box-shadow:0 0 0 3px rgba(63,121,173,.12)!important;
}

input[type="checkbox"],
input[type="radio"]{
    accent-color:var(--blue);
}

/* ---------- Buttons ---------- */
input[type="submit"],
input[type="button"],
input[type="reset"],
button{
    border:1px solid var(--blue-dark)!important;
    border-radius:6px!important;
    background:var(--blue)!important;
    color:#fff!important;
    padding:7px 12px!important;
    min-height:34px;
    font-family:Verdana,Arial,sans-serif!important;
    font-size:12px!important;
    font-weight:bold!important;
    cursor:pointer;
    transition:all .15s ease;
}

input[type="submit"]:hover,
input[type="button"]:hover,
button:hover{
    background:var(--blue-dark)!important;
    box-shadow:0 3px 9px rgba(47,98,143,.18);
}

input[type="reset"]{
    background:#7b8995!important;
    border-color:#6c7984!important;
}

input[type="reset"]:hover{
    background:#697681!important;
}

/* ---------- Users.php left list ---------- */
div.scroll{
    width:172px;
    height:550px;
    overflow:auto;
    background:#f8fafc!important;
    padding:7px!important;
    border-top:1px solid var(--line);
}

div.scroll a{
    display:block;
    padding:6px 7px;
    margin:1px 0;
    border-radius:5px;
    color:#31485d;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

div.scroll a:hover{
    background:#e7f0f7;
    color:#1c537e;
    text-decoration:none;
}

div.scroll del a{
    color:#99a4ae;
}

/* Main users.php 900px shell keeps original geometry */
table[width="900"]{
    background:#fff;
}

iframe[name="I1"]{
    display:block;
    background:#fff;
}

/* ---------- User details ---------- */
.user-detail-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:8px;
    box-shadow:var(--shadow);
    padding:10px 12px;
}

.user-actions{
    margin-top:8px;
    padding-top:8px;
    border-top:1px solid var(--line);
}

.user-actions a{
    display:inline-block;
    padding:6px 9px;
    margin:2px 2px 2px 0;
    border:1px solid #c8d5df;
    border-radius:5px;
    background:#f7fafc;
    font-weight:bold;
}

.user-actions a:hover{
    background:#e9f2f8;
}

/* ---------- Invoice list ---------- */
.invoice-wrap{
    background:#fff;
    border:1px solid var(--line);
    border-radius:8px;
    overflow:auto;
    box-shadow:var(--shadow);
    margin-top:8px;
}

.invoice-wrap table{
    width:100%!important;
}

.invoice-wrap th{
    white-space:nowrap;
}

/* ---------- Legacy content pages ---------- */
.legacy-panel{
    max-width:900px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
    padding:18px;
}

.legacy-panel h3,
.legacy-panel p:first-child{
    margin-top:0;
}

/* ---------- Reports / Kaca left menu ---------- */
.side-menu{
    background:#fff;
    border:1px solid var(--line);
    border-radius:8px;
    padding:10px;
    box-shadow:var(--shadow);
}

.side-menu a{
    display:block;
    padding:7px 8px;
    border-radius:5px;
    margin-bottom:3px;
}

.side-menu a:hover{
    background:#e9f2f8;
}

/* ---------- Horizontal divider ---------- */
hr{
    border:0;
    border-top:1px solid var(--line);
    height:1px;
    margin:12px 0;
}

/* ---------- Datepicker ---------- */
.dpTable{
    font-family:Verdana,Arial,Helvetica,sans-serif;
    font-size:12px;
    text-align:center;
    color:#344454;
    background:#fff;
    border:1px solid #bfcbd6;
    border-radius:7px;
    box-shadow:0 5px 16px rgba(0,0,0,.12);
}
.dpTD{border:1px solid #edf1f4}
.dpDayHighlightTD{background:#dce8f3;border:1px solid #b8c8d8}
.dpTDHover{background:#e3edf6;border:1px solid #9fb6ca;cursor:pointer;color:#154a77}
.dpDayTD{background:#dce4eb;border:1px solid #c8d1d9;color:#263a4c}
.dpTitleText{font-size:12px;color:#455a6d;font-weight:bold}
.dpDayHighlight{color:#174f83;font-weight:bold}
.dpButton,.dpTodayButton{
    font-family:Verdana,Arial,Helvetica,sans-serif;
    font-size:10px;
    color:#334a5e;
    background:#edf2f6;
    font-weight:bold;
    padding:3px 6px;
    border:1px solid #c6d0d9;
    border-radius:4px;
}

/* ---------- Login: keep the good existing design and polish subtly ---------- */
.login-box{
    border:1px solid #d2dbe3;
    box-shadow:0 8px 24px rgba(32,47,61,.12);
}

.form-control{
    border-color:#bdc8d2!important;
    box-shadow:none!important;
}
.form-control:focus{
    border-color:#5f8db8!important;
    box-shadow:0 0 0 3px rgba(95,141,184,.12)!important;
}
.btn{border-radius:6px!important}

/* ---------- Print ---------- */
@media print{
    body{
        background:#fff!important;
        padding:0!important;
    }
    .classic-nav,
    input[type="button"],
    input[type="reset"]{
        display:none!important;
    }
    table,.legacy-panel,.invoice-wrap{
        box-shadow:none!important;
    }
}

/* ---------- Responsive without breaking legacy geometry ---------- */
@media(max-width:980px){
    body{padding:10px}
    table[width="900"]{
        width:100%!important;
    }
}

@media(max-width:700px){
    body{padding:7px}
    td{padding:5px 6px}
    input[type="text"], input[type="password"], select, textarea{
        max-width:100%;
    }
}