/* nowoczesna: a Gmail-like look on top of Roundcube Elastic for every webmail except webmail.keylist.gg.
   Light blue-grey canvas, pill folders, white rounded cards for list and message, big Compose button, Comfortaa. */

@font-face{font-family:"Comfortaa";font-style:normal;font-display:swap;font-weight:300 700;
  src:url("../fonts/comfortaa-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Comfortaa";font-style:normal;font-display:swap;font-weight:300 700;
  src:url("../fonts/comfortaa-latin-wght-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --g-canvas:#f6f8fc; --g-card:#fff; --g-text:#1f1f1f; --g-muted:#5f6368; --g-line:#eceff1;
  --g-accent:#0b57d0; --g-accent-hover:#0842a0; --g-folder-sel:#d3e3fd; --g-hover:#e9eef6;
  --g-row-sel:#c2dbff; --g-compose:#c2e7ff; --g-compose-text:#001d35; --g-search:#eaf1fb;
  --g-font:"Comfortaa",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

html,body,button,input,select,textarea,.form-control,.btn,.popover,.ui-dialog{font-family:var(--g-font)!important}
body{background:var(--g-canvas)!important;color:var(--g-text);-webkit-font-smoothing:antialiased}
a{color:var(--g-accent)}

/* ---------- canvas: no frames between the columns ---------- */
#layout{background:var(--g-canvas)!important}
#layout-menu,#layout-sidebar,#layout-list,#layout-content{border:0!important;box-shadow:none!important}
#layout-menu,#layout-sidebar{background:var(--g-canvas)!important}
.header{background:transparent!important;border-bottom:0!important}
.footer{background:transparent!important;border-top:0!important}

/* ---------- left rail (apps) ---------- */
#layout-menu{color:var(--g-muted)}
#layout-menu #logo{display:none}
#layout-menu #taskmenu a{color:var(--g-muted)!important;border-radius:16px;margin:2px 8px}
#layout-menu #taskmenu a:before{color:var(--g-muted)!important}
#layout-menu #taskmenu a:hover{background:var(--g-hover)!important}
#layout-menu #taskmenu a.selected{background:var(--g-folder-sel)!important;color:var(--g-text)!important}
#layout-menu #taskmenu a.selected:before{color:var(--g-text)!important}
/* Compose: the big pastel button */
#layout-menu #taskmenu a.compose{background:var(--g-compose)!important;color:var(--g-compose-text)!important;
  border-radius:16px!important;margin:8px 8px 14px;box-shadow:0 1px 2px rgba(0,0,0,.08),0 1px 3px 1px rgba(0,0,0,.06);font-weight:700}
#layout-menu #taskmenu a.compose:before{color:var(--g-compose-text)!important}
#layout-menu #taskmenu a.compose:hover{box-shadow:0 1px 3px rgba(0,0,0,.15),0 4px 8px 3px rgba(0,0,0,.08)}

/* ---------- folders: pills ---------- */
#layout-sidebar .header .header-title{color:var(--g-muted);font-weight:600}
#layout-sidebar .header a,#layout-sidebar .header a:before{color:var(--g-muted)!important}
#folderlist-content{background:transparent!important}
#folderlist-content .listing li{border:0!important;background:transparent!important}
#folderlist-content .listing li>a{border-radius:0 18px 18px 0;margin-right:10px;padding-top:6px;padding-bottom:6px;color:var(--g-text)!important}
#folderlist-content .listing li>a:hover{background:var(--g-hover)}
#folderlist-content .listing li.selected>a{background:var(--g-folder-sel)!important;color:var(--g-text)!important;font-weight:700}
#folderlist-content .listing li.selected>a:before,#folderlist-content .listing li>a:before{color:var(--g-muted)!important}
#folderlist-content .unreadcount{background:transparent!important;color:var(--g-text)!important;font-weight:700;border:0!important}

/* ---------- message list: white rounded card ---------- */
#layout-list{background:var(--g-card)!important;border-radius:16px;margin:8px 8px 8px 0;overflow:hidden}
#layout-list .header{background:var(--g-card)!important}
#layout-list .header a,#layout-list .header a:before,#layout-list .toolbar a,#layout-list .toolbar a:before{color:var(--g-muted)!important}
#messagelist-content,#layout-list .scroller{background:var(--g-card)!important}
/* search: pill */
#layout-list .searchbar,#mailsearchform{background:var(--g-search)!important;border:0!important;border-radius:24px!important;margin:4px 12px 8px!important}
#layout-list .searchbar input{background:transparent!important;border:0!important;box-shadow:none!important}
#layout-list .searchbar input:focus{background:#fff!important}
/* rows */
#messagelist tr td{border-bottom:1px solid var(--g-line)!important;background:var(--g-card)}
#messagelist tr:not(.unread) td{background:#f2f6fc}
#messagelist tr.unread td{background:var(--g-card)}
#messagelist tr.unread td.subject .fromto,#messagelist tr.unread td.subject .subject a{font-weight:700;color:var(--g-text)}
#messagelist tr td.subject .subject a{color:var(--g-text)}
#messagelist tr td.subject .date,#messagelist tr td.subject .size{color:var(--g-muted)}
#messagelist tr:hover{box-shadow:0 1px 2px 0 rgba(60,64,67,.3),0 1px 3px 1px rgba(60,64,67,.15);position:relative;z-index:1}
#messagelist tr.selected td,#messagelist tr.selected td a,#messagelist tr.selected td span{background:var(--g-row-sel)!important;color:var(--g-text)!important}
#messagelist tr.focused td{outline:0}
#messagelist tr.flagged td span.subject a{color:#c5221f}
#layout-list .footer{background:var(--g-card)!important;color:var(--g-muted)}

/* ---------- message content: white rounded card ---------- */
#layout-content{background:var(--g-card)!important;border-radius:16px;margin:8px 8px 8px 0;overflow:hidden}
#layout-content .header{background:var(--g-card)!important}
#layout-content .header a,#layout-content .header a:before,#layout-content .toolbar a,#layout-content .toolbar a:before{color:var(--g-muted)!important}
#layout-content .toolbar a:hover{background:var(--g-hover);border-radius:50%}
#layout-content .iframe-wrapper,#layout-content .formcontent,#layout-content .content{background:var(--g-card)!important}
.watermark,#layout-content .watermark{opacity:.35}

/* ---------- buttons, inputs, popups ---------- */
.btn{border-radius:20px!important;font-weight:600}
.btn-primary,.mainaction,.btn.mainaction,.formbuttons .btn.mainaction,button.mainaction{
  background:var(--g-accent)!important;border-color:var(--g-accent)!important;color:#fff!important}
.btn-primary:hover,.mainaction:hover{background:var(--g-accent-hover)!important;border-color:var(--g-accent-hover)!important}
.form-control,.custom-select{border-radius:8px!important}
.form-control:focus,.custom-select:focus{border-color:var(--g-accent)!important;box-shadow:0 0 0 2px rgba(11,87,208,.2)!important}
.popover,.popupmenu,.ui-dialog{border:0!important;border-radius:12px!important;box-shadow:0 4px 8px 3px rgba(60,64,67,.15),0 1px 3px rgba(60,64,67,.3)!important}
.ui-dialog .ui-dialog-titlebar{background:transparent!important;border:0!important}
.popupmenu li a:hover{background:var(--g-hover)!important}

/* settings / contacts lists use the same pills */
#settings-menu li>a,#settings-sections li>a,#directorylist li>a{border-radius:0 18px 18px 0}
#settings-menu li.selected>a,#settings-sections li.selected>a,#directorylist li.selected>a{background:var(--g-folder-sel)!important;color:var(--g-text)!important}
.records-table tr.selected td{background:var(--g-row-sel)!important;color:var(--g-text)!important}

/* ---------- login: centred card ---------- */
body.task-login{background:var(--g-canvas)!important}
body.task-login #layout-content{background:transparent!important;border-radius:0;margin:0;display:flex!important;flex-direction:column;
  align-items:center!important;justify-content:center!important;padding:16px!important}
body.task-login #login-form{width:100%;max-width:420px;margin:auto!important;top:auto!important;background:var(--g-card);
  border-radius:28px;padding:36px 32px 20px!important;box-shadow:0 1px 2px rgba(60,64,67,.15),0 2px 6px 2px rgba(60,64,67,.1)}
#nw-head{text-align:center;margin-bottom:24px}
#nw-icon{width:56px;height:56px;margin:0 auto 16px;border-radius:16px;
  background:var(--g-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2.5'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E") center/30px no-repeat}
#nw-title{font-size:24px;font-weight:700;color:var(--g-text);margin:0 0 6px}
#nw-sub{font-size:14px;color:var(--g-muted);margin:0}
body.task-login #login-form table{width:100%}
body.task-login #login-form td{padding:0 0 14px!important}
body.task-login #login-form .input-group-text{border-radius:12px 0 0 12px!important;background:var(--g-canvas)!important;border-color:#dadce0!important;color:var(--g-muted)!important}
body.task-login #login-form .form-control{height:48px;font-size:15px;border-color:#dadce0!important;border-radius:0 12px 12px 0!important}
body.task-login #login-form .formbuttons{padding:6px 0 0!important}
body.task-login #login-form .formbuttons .btn{width:100%;height:48px;font-size:15px;border-radius:24px!important;text-transform:none!important}
body.task-login #login-footer{color:var(--g-muted);text-align:center;font-size:12px;margin-top:14px;background:transparent}
body.task-login #login-footer a{color:var(--g-muted)}

/* ---------- round 2 (owner's screenshot 2026-10-28) ---------- */
/* leftover dark Elastic header in the rail */
#layout-menu>*:not(#taskmenu),#layout-menu .popover-header,#layout-menu #logo,#layout-menu a.logo{background:transparent!important}
#layout-menu #logo{display:none!important}
html body #layout-menu{background:var(--g-canvas)!important}
/* rail labels fit */
#layout-menu #taskmenu a .inner{font-size:11px;letter-spacing:-.01em;white-space:nowrap}
/* wider list, gap between the two cards */
@media (min-width:1200px){
  #layout-list{width:auto!important;max-width:none!important;flex:1 1 40%!important;min-width:400px}
  #layout-content{flex:1 1 60%!important;margin-left:8px!important}
}
/* sender line clearer, subject regular */
#messagelist tr td.subject .fromto,#messagelist tr td.subject .fromto span{color:var(--g-text)!important;font-weight:600}
#messagelist tr:not(.unread) td.subject .fromto,#messagelist tr:not(.unread) td.subject .fromto span{font-weight:500}
#messagelist tr td.subject .subject a{font-weight:400}
#messagelist tr.unread td.subject .subject a{font-weight:700}
#messagelist tr td{padding-top:8px!important;padding-bottom:8px!important}
#taskmenu .special-buttons{background:var(--g-canvas)!important}
/* round 3: rail wide enough for "O programie" / "Wyloguj"; cards float off the top edge */
@media (min-width:1200px){
  #layout-menu{width:88px!important}
  #layout-list,#layout-content{margin-top:8px!important;margin-bottom:8px!important;height:calc(100% - 16px)!important}
}
#taskmenu .special-buttons a .inner{font-size:11px;white-space:nowrap}
#layout-list>.header,#layout-content>.header{border-bottom:1px solid var(--g-line)!important}
/* round 4: no per-cell lines; no Elastic focus bar on the left */
#messagelist tr td{border-left:0!important;border-right:0!important;box-shadow:none!important}
#messagelist tr.focused td,#messagelist tr.focused td:first-child,#messagelist tr.selected td:first-child{box-shadow:none!important;border-left:0!important}
#messagelist tr.focused,#messagelist tr.selected{outline:0!important}