/* Company global page background + centered watermark
   Background image: /images/background.png
   Watermark logo: /images/Aynu-LOGO.png with 80% transparency effect (20% visible opacity)
*/
html {
  min-height: 100%;
}
body {
  min-height: 100vh;
  background-color: #f4f7fb !important;
  background-image: url('/images/background.png') !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  background-attachment: fixed !important;
  position: relative;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image: url('/images/Aynu-LOGO.png');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: min(420px, 55vw);
  opacity: 0.20;
  pointer-events: none;
  z-index: 0;
}
body > :not(script):not(style) {
  position: relative;
  z-index: 1;
}
@media print {
  .company-standalone-footer { display: none !important; }
}

@media (max-width: 900px) {
  body {
    background-attachment: scroll !important;
  }
  body::before {
    background-size: min(340px, 70vw);
    opacity: 0.18;
  }
}
@media (max-width: 520px) {
  body::before {
    background-size: min(260px, 78vw);
    opacity: 0.16;
  }
}
@media print {
  body {
    background: #ffffff !important;
  }
  body::before {
    display: none !important;
  }
}

/* Home page: remove wallpaper and watermark while keeping a clean solid background. */
body.home-page {
  background-color: #f6f9fd !important;
  background-image: none !important;
  background-attachment: scroll !important;
}
body.home-page::before {
  display: none !important;
}
body.home-page .main {
  background: #f6f9fd !important;
}

/* ===== Aynu Logo-Matched Uniform Theme v10.3 =====
   Header: light neutral for full-colour Aynu logo
   Footer: Aynu navy
   Highlights: Aynu gold
*/
:root {
  --company-navy: #203E76;
  --company-navy-dark: #17315F;
  --company-gold: #E3AD25;
  --company-gold-dark: #B78300;
  --company-header: #F7F9FC;
  --company-line: #D9E2F0;
}

/* Common Digital Touch header */
body .header {
  background: var(--company-header) !important;
  color: var(--company-navy) !important;
  border-bottom: 4px solid var(--company-gold) !important;
  box-shadow: 0 8px 24px rgba(32, 62, 118, .14) !important;
}
body .header .brand-logo {
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
body .header .brand-logo img {
  object-fit: contain !important;
  object-position: left center !important;
}
body .header .portal-title,
body .header .portal-title .name,
body .header .portal-name {
  color: var(--company-navy) !important;
}
body .header .portal-title .sub,
body .header .portal-subtitle {
  color: var(--company-gold-dark) !important;
  opacity: 1 !important;
}
body .header .header-right {
  background: var(--company-gold) !important;
  color: var(--company-navy) !important;
  border: 1px solid rgba(32, 62, 118, .18) !important;
  box-shadow: 0 8px 20px rgba(32, 62, 118, .14) !important;
}
body .header .clock-icon {
  border-color: var(--company-navy) !important;
  background: rgba(255, 255, 255, .40) !important;
  box-shadow: inset 0 0 0 1px rgba(32, 62, 118, .10) !important;
}
body .header .clock-icon::before,
body .header .clock-icon::after {
  background: var(--company-navy) !important;
}
body .header #time,
body .header #date {
  color: var(--company-navy) !important;
  text-shadow: none !important;
}
body .header .news-strip {
  border-color: var(--company-line) !important;
  box-shadow: 0 6px 18px rgba(32, 62, 118, .10) !important;
}

/* Common footer */
body .footer {
  background: var(--company-navy) !important;
  color: #FFFFFF !important;
  border-top: 4px solid var(--company-gold) !important;
  box-shadow: 0 -6px 20px rgba(32, 62, 118, .12) !important;
}
body .footer .footer-visitor {
  background: var(--company-gold) !important;
  color: var(--company-navy) !important;
  border-color: rgba(255, 255, 255, .40) !important;
}
body .footer .footer-main,
body .footer .footer-credit {
  color: #FFFFFF !important;
}


/* Uniform RAS Group footer alignment across portal pages. */
body .footer .footer-content {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  grid-template-areas: "visitor credit main" !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
}
body .footer .footer-visitor { grid-area: visitor !important; justify-self: start !important; }
body .footer .footer-credit { grid-area: credit !important; justify-self: center !important; text-align: center !important; white-space: nowrap !important; }
body .footer .footer-main { grid-area: main !important; justify-self: end !important; text-align: right !important; }
@media (max-width: 768px) {
  body .footer .footer-content { grid-template-columns: 1fr !important; grid-template-areas: "visitor" "credit" "main" !important; text-align: center !important; }
  body .footer .footer-visitor, body .footer .footer-credit, body .footer .footer-main { justify-self: center !important; text-align: center !important; }
  body .footer .footer-credit { white-space: normal !important; }
}

/* Uniform login cards and actions */
body .card-head,
body .side-head {
  background: var(--company-gold) !important;
  color: var(--company-navy) !important;
}
body .page-title,
body .label,
body .captcha-question {
  color: var(--company-navy) !important;
}
body .input:focus,
body input:focus,
body select:focus,
body textarea:focus {
  border-color: var(--company-gold) !important;
  box-shadow: 0 0 0 3px rgba(227, 173, 37, .20) !important;
}
body .btn.orange,
body button.company-primary,
body .login-card button[type="submit"] {
  background: var(--company-gold) !important;
  color: var(--company-navy) !important;
}
body .btn.home,
body .btn-blue,
body .btn-primary,
body .btn:not(.orange):not(.red):not(.delete):not(.btn-light) {
  background: var(--company-navy) !important;
  color: #FFFFFF !important;
}

/* Standalone administration top bars */
body .topbar,
body .top {
  background: var(--company-header) !important;
  color: var(--company-navy) !important;
  border-bottom: 4px solid var(--company-gold) !important;
  box-shadow: 0 8px 24px rgba(32, 62, 118, .14) !important;
}
body .topbar .brand img {
  width: 180px !important;
  height: 54px !important;
  max-width: 45vw !important;
  object-fit: contain !important;
  object-position: left center !important;
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
body .topbar .brand h1,
body .topbar .brand span,
body .top h1 {
  color: var(--company-navy) !important;
  opacity: 1 !important;
}
body .topbar .pill {
  background: rgba(227, 173, 37, .18) !important;
  border-color: rgba(32, 62, 118, .16) !important;
  color: var(--company-navy) !important;
}
body .topbar .btn-light,
body .top .btn-light {
  background: var(--company-gold) !important;
  color: var(--company-navy) !important;
}

/* Standalone branded login shell fallback */
body.company-login-page {
  display: flex !important;
  min-height: 100vh !important;
  flex-direction: column !important;
  padding: 0 !important;
}
body.company-login-page .main {
  width: 100%;
}

@media (max-width: 680px) {
  body .header .brand-logo { width: 190px !important; height: 58px !important; }
  body .header .header-right { width: 100% !important; }
  body .topbar .brand img { width: 150px !important; height: 48px !important; }
}
/* ===== END Aynu Logo-Matched Uniform Theme v10.3 ===== */


/* ===== Home Employee Corner + Gallery Logo Theme v10.4 =====
   Aynu gold headings, navy content and light neutral panel surfaces.
*/
body.home-page {
  --employee-corner-accent: linear-gradient(135deg, #E8B936 0%, #E3AD25 55%, #D39A12 100%) !important;
}
body.home-page .employee-corner,
body.home-page .gallery-panel {
  background: linear-gradient(180deg, #FFFFFF 0%, #F7F9FC 100%) !important;
  border-color: rgba(227, 173, 37, .55) !important;
  box-shadow: 0 12px 32px rgba(32, 62, 118, .14) !important;
}
body.home-page .corner-head,
body.home-page .gallery-head {
  background: var(--employee-corner-accent) !important;
  color: var(--company-navy) !important;
}
body.home-page .corner-head h3,
body.home-page .gallery-head h3,
body.home-page .corner-badge {
  color: var(--company-navy) !important;
  opacity: 1 !important;
}
body.home-page .corner-title {
  background: rgba(227, 173, 37, .18) !important;
  color: var(--company-navy) !important;
  border: 1px solid rgba(227, 173, 37, .42) !important;
}
body.home-page .birthday-photo-wrap,
body.home-page .gallery-photo-wrap {
  background: linear-gradient(135deg, #F2D36F 0%, #E3AD25 52%, #B78300 100%) !important;
  box-shadow: 0 0 0 7px rgba(227, 173, 37, .10), 0 12px 24px rgba(32, 62, 118, .15) !important;
}
body.home-page .corner-name,
body.home-page .gallery-title {
  color: var(--company-navy) !important;
}
body.home-page .corner-meta,
body.home-page .gallery-desc {
  color: #334155 !important;
}
body.home-page .corner-message {
  background: #FFF8E6 !important;
  color: var(--company-navy) !important;
  border-color: rgba(227, 173, 37, .65) !important;
}
body.home-page .corner-list li,
body.home-page .quote-box,
body.home-page .quote-text {
  background: linear-gradient(135deg, #F7F9FC 0%, #EEF3FA 100%) !important;
  border-color: var(--company-line) !important;
  color: var(--company-navy) !important;
}
body.home-page .gallery-desc {
  background: #FFF8E6 !important;
  border-color: rgba(227, 173, 37, .45) !important;
}
body.home-page .corner-dots span.active,
body.home-page .gallery-dots span.active {
  background: var(--company-gold) !important;
  box-shadow: 0 0 0 3px rgba(227, 173, 37, .18) !important;
}
body.home-page .balloon {
  background: rgba(227, 173, 37, .48) !important;
}
body.home-page .balloon.b2 {
  background: rgba(32, 62, 118, .34) !important;
}
body.home-page .balloon.b3 {
  background: rgba(183, 131, 0, .42) !important;
}
/* ===== END Home Employee Corner + Gallery Logo Theme v10.4 ===== */

/* ===== Aynu Seven-Point Final Uniform Theme v10.5 =====
   Home panels, watermark, news highlight, footer, screen protection and Help Bot.
*/
:root {
  --company-navy: #203E76;
  --company-navy-dark: #17315F;
  --company-gold: #E3AD25;
  --company-gold-dark: #B78300;
  --company-cream: #FFF8E6;
  --company-header: #F7F9FC;
  --company-line: #D9E2F0;
}

/* Home wallpaper and visible centered transparent Aynu logo. */
body.home-page {
  background-color: #F7F9FC !important;
  background-image: url('/images/background.png') !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  background-attachment: fixed !important;
}
body.home-page::before {
  display: block !important;
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  background-image: url('/images/Aynu-LOGO.png') !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: min(520px, 46vw) auto !important;
  opacity: .13 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
body.home-page .main {
  background: transparent !important;
}
body.home-page .dashboard,
body.home-page .header,
body.home-page .footer {
  position: relative;
  z-index: 1;
}
body.home-page .assist-widget {
  position: fixed !important;
  z-index: 9999 !important;
}

/* Employee Corner and Gallery: unmistakable Aynu navy header with gold line. */
body.home-page .employee-corner,
body.home-page .gallery-panel {
  background: linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(247,249,252,.96) 100%) !important;
  border: 1px solid rgba(227, 173, 37, .72) !important;
  box-shadow: 0 14px 34px rgba(32, 62, 118, .18) !important;
}
body.home-page .corner-head,
body.home-page .gallery-head {
  background: linear-gradient(135deg, var(--company-navy) 0%, var(--company-navy-dark) 100%) !important;
  color: #FFFFFF !important;
  border-bottom: 4px solid var(--company-gold) !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.10) !important;
}
body.home-page .corner-head h3,
body.home-page .gallery-head h3 {
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.18) !important;
}
body.home-page .corner-badge {
  color: #F7D979 !important;
  opacity: 1 !important;
}
body.home-page .corner-title {
  background: var(--company-cream) !important;
  color: var(--company-navy) !important;
  border: 1px solid rgba(227,173,37,.62) !important;
}
body.home-page .birthday-photo-wrap,
body.home-page .gallery-photo-wrap {
  background: linear-gradient(135deg, #F4D46A 0%, var(--company-gold) 52%, var(--company-gold-dark) 100%) !important;
}

/* Live News / Announcement: bright cream panel with gold outline and navy label. */
body .header .news-strip,
body.home-page .news-strip {
  background: linear-gradient(180deg, #FFFFFF 0%, #FFF8E6 100%) !important;
  border: 2px solid var(--company-gold) !important;
  box-shadow: 0 0 0 3px rgba(227,173,37,.16), 0 10px 26px rgba(32,62,118,.20) !important;
  animation: aynuNewsGlow 3.2s ease-in-out infinite !important;
}
body .header .news-strip-label,
body.home-page .news-strip-label {
  background: var(--company-navy) !important;
  color: #FFFFFF !important;
  border: 2px solid var(--company-gold) !important;
  box-shadow: 0 5px 12px rgba(32,62,118,.24) !important;
}
body .header .news-strip-ticker,
body .header .news-item.normal,
body.home-page .news-strip-ticker,
body.home-page .news-item.normal {
  color: var(--company-navy) !important;
}
@keyframes aynuNewsGlow {
  0%,100% { box-shadow: 0 0 0 2px rgba(227,173,37,.12), 0 8px 22px rgba(32,62,118,.16); }
  50% { box-shadow: 0 0 0 4px rgba(227,173,37,.24), 0 12px 30px rgba(32,62,118,.24); }
}

/* Footer credit and standalone page footer. */
.company-standalone-footer {
  margin-top: 24px;
  width: 100%;
  padding: 12px 18px;
  text-align: center;
  background: var(--company-navy);
  color: #FFFFFF;
  border-top: 4px solid var(--company-gold);
  font-family: "Trebuchet MS", Arial, sans-serif;
  font-size: 13px;
  font-weight: 800;
  box-shadow: 0 -6px 20px rgba(32,62,118,.12);
}

/* Protected-screen overlay and Resume button: exact Aynu palette. */
.company-global-screen-guard,
.aynu-secure-blur {
  background: rgba(32,62,118,.88) !important;
}
.company-global-screen-guard-card,
.aynu-secure-blur-card {
  border-color: rgba(227,173,37,.58) !important;
  box-shadow: 0 24px 70px rgba(23,49,95,.48) !important;
}
.company-global-screen-guard-card b,
.aynu-secure-blur-card b {
  color: var(--company-gold) !important;
}
.company-global-screen-guard-card button,
.aynu-secure-blur-card button,
#aynuSecureResume {
  background: var(--company-gold) !important;
  color: var(--company-navy) !important;
  border: 2px solid rgba(255,255,255,.45) !important;
  box-shadow: 0 8px 20px rgba(23,49,95,.30) !important;
  transition: transform .18s ease, background .18s ease, color .18s ease !important;
}
.company-global-screen-guard-card button:hover,
.aynu-secure-blur-card button:hover,
#aynuSecureResume:hover {
  background: #FFFFFF !important;
  color: var(--company-navy) !important;
  transform: translateY(-1px) !important;
}

/* Aynu Assist / Help Bot complete theme. */
body.home-page .assist-toggle {
  background: linear-gradient(135deg, var(--company-navy) 0%, var(--company-navy-dark) 100%) !important;
  color: #FFFFFF !important;
  border: 4px solid var(--company-gold) !important;
  box-shadow: 0 14px 34px rgba(32,62,118,.34), 0 0 0 4px rgba(227,173,37,.14) !important;
}
body.home-page .assist-toggle:hover {
  box-shadow: 0 18px 42px rgba(32,62,118,.42), 0 0 0 5px rgba(227,173,37,.20) !important;
}
body.home-page .assist-panel {
  background: var(--company-header) !important;
  border: 2px solid var(--company-gold) !important;
  box-shadow: 0 24px 60px rgba(32,62,118,.30) !important;
}
body.home-page .assist-head {
  background: linear-gradient(135deg, var(--company-navy) 0%, var(--company-navy-dark) 100%) !important;
  color: #FFFFFF !important;
  border-bottom: 4px solid var(--company-gold) !important;
}
body.home-page .assist-avatar {
  background: var(--company-gold) !important;
  color: var(--company-navy) !important;
  border: 2px solid rgba(255,255,255,.55) !important;
}
body.home-page .assist-lang button,
body.home-page .assist-close {
  border-color: rgba(227,173,37,.60) !important;
}
body.home-page .assist-lang button.active {
  background: var(--company-gold) !important;
  color: var(--company-navy) !important;
}
body.home-page .assist-body,
body.home-page .assist-suggestions {
  background: #F7F9FC !important;
}
body.home-page .assist-msg.bot {
  background: #FFFFFF !important;
  border-color: var(--company-line) !important;
  color: var(--company-navy) !important;
}
body.home-page .assist-msg.user {
  background: var(--company-cream) !important;
  border-color: rgba(227,173,37,.58) !important;
  color: var(--company-navy) !important;
}
body.home-page .assist-link {
  background: var(--company-navy) !important;
  color: #FFFFFF !important;
}
body.home-page .assist-chip {
  background: #FFFFFF !important;
  color: var(--company-navy) !important;
  border-color: var(--company-line) !important;
}
body.home-page .assist-chip:hover {
  border-color: var(--company-gold) !important;
  color: var(--company-gold-dark) !important;
}
body.home-page .assist-input {
  background: #FFFFFF !important;
  border-top-color: var(--company-line) !important;
}
body.home-page .assist-input input:focus {
  border-color: var(--company-gold) !important;
  box-shadow: 0 0 0 3px rgba(227,173,37,.20) !important;
}
body.home-page .assist-input button {
  background: var(--company-gold) !important;
  color: var(--company-navy) !important;
  border: 1px solid var(--company-gold-dark) !important;
  box-shadow: 0 6px 14px rgba(32,62,118,.16) !important;
}
body.home-page .assist-input button:hover {
  background: var(--company-navy) !important;
  color: #FFFFFF !important;
}

@media print {
  .company-standalone-footer { display: none !important; }
}

@media (max-width: 900px) {
  body.home-page { background-attachment: scroll !important; }
  body.home-page::before { background-size: min(400px, 68vw) auto !important; opacity: .12 !important; }
}
@media (max-width: 520px) {
  body.home-page::before { background-size: min(310px, 80vw) auto !important; opacity: .11 !important; }
  body.home-page .corner-head,
  body.home-page .gallery-head { border-bottom-width: 3px !important; }
}
/* ===== END Aynu Seven-Point Final Uniform Theme v10.5 ===== */


/* ===== Employee clean surface: screen protection without full-page watermark v11.1 =====
   Applied to Employee Login, Employee Workspace, Chat, Profile, document lists/viewer,
   password setup/reset and secure print. Screenshot protection remains JavaScript-driven.
*/
body.employee-no-watermark::before {
  display: none !important;
  content: none !important;
  background-image: none !important;
  opacity: 0 !important;
}
body.employee-no-watermark .aynu-security-watermark {
  display: none !important;
}
/* ===== END Employee clean surface v11.1 ===== */


/* ===== Global clean page surface v11.2 =====
   No full-page logo/security watermark on Login, Admin, HR or Employee pages.
   Screenshot protection remains provided by the security guard scripts.
   Document audit watermarks are rendered only inside the document viewer/print surfaces.
*/
body::before,
body.home-page::before,
body.employee-no-watermark::before {
  display: none !important;
  content: none !important;
  background-image: none !important;
  opacity: 0 !important;
}
body .aynu-security-watermark {
  display: none !important;
}
/* ===== END Global clean page surface v11.2 ===== */

/* ===== Master Branding Dynamic Theme v12.0 ===== */
:root {
  --brand-primary: var(--company-navy, #203E76);
  --brand-primary-dark: var(--company-navy-dark, #17315F);
  --brand-accent: var(--company-gold, #E3AD25);
  --brand-accent-dark: var(--company-gold-dark, #B78300);
  --brand-page: var(--company-cream, #F4F7FB);
  --brand-header: var(--company-header, #F7F9FC);
  --brand-header-text: #203E76;
  --brand-footer-text: #FFFFFF;
}
body { background-color: var(--brand-page) !important; }
.header,
body.home-page .header {
  background: var(--brand-header) !important;
  color: var(--brand-header-text) !important;
  border-bottom-color: var(--brand-accent) !important;
}
.portal-title .sub,
.portal-title .portal-subtitle { color: var(--brand-accent-dark) !important; }
.header-right,
body.home-page .header-right,
.card-head,
.side-head,
.company-primary,
.btn.orange {
  background: var(--brand-accent) !important;
  color: var(--brand-primary) !important;
}
.footer,
.company-standalone-footer {
  background: var(--brand-primary) !important;
  color: var(--brand-footer-text) !important;
  border-top-color: var(--brand-accent) !important;
}
.footer-visitor { background: var(--brand-accent) !important; color: var(--brand-primary) !important; }
.page-title { color: var(--brand-accent-dark) !important; }
.btn,
.btn.home,
body.home-page .assist-link { background: var(--brand-primary) !important; }
.hr-tab.active,
body.home-page .corner-head,
body.home-page .gallery-head,
body.home-page .assist-input button {
  background: var(--brand-accent) !important;
  color: var(--brand-primary) !important;
  border-color: var(--brand-accent-dark) !important;
}
body.home-page .assist-toggle,
body.home-page .assist-head { background: var(--brand-primary) !important; border-color: var(--brand-accent) !important; }
body.home-page .assist-panel { border-color: var(--brand-accent) !important; }
/* ===== END Master Branding Dynamic Theme v12.0 ===== */