/*
 * Lucifernet theme for Supermon (2026-09-26): matches the XLX522 dashboard (xlx.lucifernet.com), where this page is
 * embedded as an iframe (index.php?show=myallstar). Loaded after supermon.css + jquery-ui.css and overrides them.
 * Status row colours keep their meaning, only softened.
 */
:root { --lt-red:#da291c; --lt-red-dark:#b71f14; --lt-ink:#111; --lt-text:#1a1a1a; --lt-text-2:#4a4a4a; --lt-muted:#767676; --lt-line:#e6e6e6; --lt-page:#f5f5f5; }

html, body { background: var(--lt-page) !important; }
body { margin: 0; padding: 12px 14px 20px; color: var(--lt-text); font: 14px/1.5 'Inter', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif !important; -webkit-font-smoothing: antialiased; }
body, body * { font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif !important; }
a { color: var(--lt-red); }

/* ---- header: keep the owner's own banner photo (background.jpg -> Cape_Coral_yard.jpg, set in global.inc) ---- */
#header { border-radius: 12px 12px 0 0 !important; margin: 0 !important; overflow: hidden; }
#headerTitle, #headerTag, #header2Tag, #headerLogin { text-shadow: 0 1px 3px rgba(0,0,0,.85), 0 0 8px rgba(0,0,0,.55) !important; }
#headerTitle { top: 16px !important; left: 20px !important; font-size: 21px !important; font-weight: 800 !important; letter-spacing: -.02em !important; }
#headerTitle i, #headerTag i, #header2Tag i, #header3Tag i, #header4Tag i { font-style: normal; }
#headerTitle a:link, #headerTitle a:visited { color: #fff !important; text-decoration: none; }
#headerTag, #header2Tag, #header3Tag, #header4Tag { left: 20px !important; color: #fff !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.4 !important; text-shadow: none !important; }
#headerTag { top: 68px !important; }
#headerLogin { top: 42px !important; left: 20px !important; }
#headerLogin a:link, #headerLogin a:visited {
    display: inline-block; padding: 3px 12px; border-radius: 999px; font-size: 12px !important; font-weight: 700 !important;
    letter-spacing: .06em; text-transform: uppercase; color: #fff !important; background: var(--lt-red); text-decoration: none;
}
#headerLogin a:hover { background: var(--lt-red-dark); color: #fff !important; font-size: 12px !important; }
#headerImg { top: 10px !important; right: 16px !important; }
#headerImg img { height: 104px; width: auto; border-radius: 10px; background: #fff; box-shadow: 0 6px 18px rgba(0,0,0,.35); }

/* ---- menu: white bar with pill links ---- */
#menu {
    background: #fff !important; border: 1px solid var(--lt-line); border-top: 0; border-radius: 0 0 12px 12px !important;
    padding: 8px 12px !important; box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.06);
}
#menu a, #menu li a, #menu .dropbtn {
    color: var(--lt-text) !important; font-size: 13.5px !important; font-weight: 600 !important; text-decoration: none;
    padding: 6px 12px !important; border-radius: 999px; display: inline-block; background: transparent !important;
}
#menu a:hover, #menu li a:hover, #menu .dropbtn:hover { background: #fbeaea !important; color: var(--lt-red) !important; }
#menu a.active, #menu li a.active { background: var(--lt-ink) !important; color: #fff !important; }
#menu .dropdown-content { background: #fff !important; border: 1px solid var(--lt-line); border-radius: 10px; box-shadow: 0 10px 28px rgba(0,0,0,.12) !important; padding: 6px; }
#menu .dropdown-content a { border-radius: 8px; display: block; }

/* ---- tables ---- */
table.gridtable {
    border-collapse: separate !important; border-spacing: 0; width: 100%; background: #fff; border: 1px solid var(--lt-line) !important;
    border-radius: 12px; overflow: hidden; box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.06); margin-top: 12px; color: var(--lt-text) !important;
}
table.gridtable th {
    background: #fafafa !important; color: var(--lt-muted) !important; border: 0 !important; border-bottom: 1px solid var(--lt-line) !important;
    font-size: 11px !important; font-weight: 700 !important; letter-spacing: .08em; text-transform: uppercase; padding: 10px 12px !important;
}
table.gridtable td { border: 0 !important; border-bottom: 1px solid #efefef !important; font-size: 13px !important; padding: 9px 12px !important; }
table.gridtable tr:last-child td { border-bottom: 0 !important; }
table.gridtable td a { color: var(--lt-red) !important; font-weight: 700; }
/* status rows: same meaning, softer colours */
table.gridtable tr.rColor td { background: #1f1f1f !important; color: #fff !important; }            /* keyed / receiving */
table.gridtable tr.cColor td { background: var(--lt-red) !important; color: #fff !important; }      /* transmitting */
table.gridtable tr.bColor td { background: #e6f6ec !important; color: #145c33 !important; }         /* active */
table.gridtable tr.gColor td { background: #f1f1f1 !important; color: var(--lt-text) !important; }  /* local node */
table.gridtable tr.tColor td { background: #fff7d6 !important; color: #6b4e00 !important; }
table.gridtable tr.lColor td { background: #e8f1fb !important; color: #174a7c !important; }
table.rtcm td, table.rtcm th { font-size: 13px !important; }

/* ---- buttons & inputs ---- */
.submit, .submit2, input[type="submit"], input[type="button"], button {
    background: var(--lt-ink) !important; color: #fff !important; border: 1px solid var(--lt-ink) !important; border-radius: 999px !important;
    padding: 6px 14px !important; font-size: 13px !important; font-weight: 600 !important; cursor: pointer; box-shadow: none !important;
}
.submit:hover, .submit2:hover, input[type="submit"]:hover, input[type="button"]:hover, button:hover { background: var(--lt-red) !important; border-color: var(--lt-red) !important; }
input[type="text"], input[type="password"], select, textarea { border: 1px solid #cfcfcf !important; border-radius: 8px !important; padding: 6px 10px !important; font-size: 14px !important; background: #fff; }
input[type="text"]:focus, input[type="password"]:focus, select:focus { outline: none; border-color: var(--lt-ink) !important; box-shadow: 0 0 0 3px rgba(17,17,17,.1); }

/* ---- jQuery UI dialogs (login, connect, etc.) ---- */
.ui-dialog { border: 1px solid var(--lt-line) !important; border-radius: 12px !important; box-shadow: 0 20px 50px rgba(0,0,0,.25) !important; padding: 0 !important; overflow: hidden; }
.ui-dialog .ui-dialog-titlebar { background: #1f1f1f !important; border: 0 !important; border-radius: 0 !important; color: #fff !important; font-weight: 700; padding: 10px 14px !important; }
.ui-dialog .ui-dialog-buttonpane { border-top: 1px solid var(--lt-line) !important; }
.ui-widget-overlay { background: rgba(0,0,0,.45) !important; opacity: 1 !important; }

/* ---- misc ---- */
#test_area { font-weight: 600; color: var(--lt-text-2); }
#footer, #footer * { color: var(--lt-muted) !important; font-size: 12px !important; }
.barbox_a { border-radius: 999px !important; overflow: hidden; }
.bar { background: var(--lt-red) !important; }

/* ---- fixes after first visual check ---- */
#menu ul { background: transparent !important; padding: 0 !important; float: none !important; }
#menu li { float: none !important; display: inline-block; }
#menu ul li a { margin: 2px 1px; }
/* logged-in header has extra lines (System Manager etc.): stack them without overlap */
#headerTag { top: 68px !important; }
#header2Tag { top: 104px !important; }
#header3Tag, #header4Tag { display: none !important; }