/* Royal Office Premium — Customer area, forms, CMS
   Account dashboard: 3 card per riga, icone grandi e centrate */

body#authentication #main,
body#registration #main,
body#my-account #main,
body#identity #main,
body#addresses #main,
body#address #main,
body#history #main,
body#order-detail #main,
body#discount #main,
body#order-slip #main,
body#order-follow #main {
  padding: 8px 0 45px;
}

body#authentication .page-content,
body#registration .page-content {
  max-width: 620px;
  margin: 0 auto;
  padding: 26px;
}

body#authentication .page-header,
body#registration .page-header {
  max-width: 620px;
  margin-left: auto;
  margin-right: auto;
}

body#authentication .login-form { margin: 0; }
body#authentication .no-account {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--ro-line);
  text-align: center;
  font-size: 12px;
}
body#authentication .forgot-password { font-size: 11px; }

/* ==========================================================
   MY ACCOUNT
   ========================================================== */
body#my-account .page-content {
  border: 0;
  padding: 0;
}

body#my-account .page-header h1,
body#my-account h1.h1,
body#my-account .page-title {
  font-size: clamp(34px, 2.5vw, 46px);
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: -0.7px;
  color: #0d2b53;
  margin-bottom: 30px;
}

/* Forza la griglia a 3 colonne anche se il TPL usa classi Bootstrap */
body#my-account .links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 0;
  width: 100%;
}

body#my-account .links > a,
body#my-account .links > div,
body#my-account .links > .col-lg-4,
body#my-account .links > .col-md-6,
body#my-account .links > .col-sm-6,
body#my-account .links > .col-xs-12 {
  width: 100% !important;
  max-width: none !important;
  flex: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

body#my-account .links > a {
  display: block;
  text-decoration: none;
}

body#my-account .links .link-item {
  position: relative;
  width: 100%;
  min-height: 200px;
  margin: 0;
  padding: 28px 54px 28px;
  border: 1px solid #dce6f0;
  border-radius: 16px;
  background: #fff;
  color: #0d2b53;
  box-shadow: 0 2px 8px rgba(13, 43, 83, 0.035);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 15px;
  text-align: center;
  font-size: 16px;
  line-height: 1.28;
  font-weight: 800;
  letter-spacing: 0;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background-color .22s ease;
}

body#my-account .links .link-item:hover {
  transform: translateY(-4px);
  border-color: #a9d4ff;
  box-shadow: 0 12px 28px rgba(13, 43, 83, 0.09);
  background: #fbfdff;
  color: #0d2b53;
}

/* Icona principale: grande, rotonda e perfettamente centrata */
body#my-account .links .link-item i,
body#my-account .links .link-item .material-icons,
body#my-account .links .link-item .material-icons-outlined,
body#my-account .links .link-item [class^="fa-"],
body#my-account .links .link-item [class*=" fa-"] {
  width: 76px;
  height: 76px;
  min-width: 76px;
  flex: 0 0 76px;
  margin: 0 auto 4px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #edf7ff;
  color: #078cff;
  font-size: 35px !important;
  line-height: 1 !important;
  text-align: center;
}

/* Il Classic theme usa Material Icons come testo dentro <i> */
body#my-account .links .link-item i.material-icons {
  font-family: 'Material Icons';
}

/* Freccia discreta sulla destra */
body#my-account .links .link-item::after {
  content: '›';
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  color: #078cff;
  font-family: Arial, sans-serif;
  font-size: 32px;
  line-height: 1;
  font-weight: 400;
  opacity: .9;
  transition: transform .2s ease;
}

body#my-account .links .link-item:hover::after {
  transform: translate(4px, -50%);
}

/* Se nel link ci sono span/testi secondari, manteniamoli leggibili */
body#my-account .links .link-item small,
body#my-account .links .link-item .account-subtitle {
  display: block;
  margin-top: -7px;
  color: #677b95;
  font-size: 13px;
  line-height: 1.35;
  font-weight: 500;
}

/* Logout centrato e più leggibile */
body#my-account .page-footer {
  margin-top: 30px;
  text-align: center;
}

body#my-account .page-footer a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 11px 18px;
  border: 1px solid #ffd2d9;
  border-radius: 10px;
  background: #fff3f5;
  color: #e23f55;
  font-size: 13px;
  line-height: 1;
  font-weight: 750;
  text-decoration: none;
  transition: .2s ease;
}

body#my-account .page-footer a:hover {
  background: #ffecef;
  border-color: #ffb9c4;
  color: #c92e43;
}

body#my-account .page-footer a i {
  font-size: 17px;
  line-height: 1;
}

/* ==========================================================
   ALTRE PAGINE ACCOUNT / CMS
   ========================================================== */
body.cms-id-category .page-content,
body#cms .page-content,
body#contact .page-content {
  padding: 24px;
}

body#contact .contact-rich,
body#contact .contact-form {
  border: 1px solid var(--ro-line);
  border-radius: 14px;
  box-shadow: none;
  background: #fff;
  padding: 20px;
}

.addresses-footer a,
.account-link {
  color: var(--ro-accent);
  font-size: 12px;
  font-weight: 750;
}

/* Tablet: 2 card per riga */
@media (max-width: 991.98px) {
  body#my-account .links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }

  body#my-account .links .link-item {
    min-height: 185px;
    padding: 26px 46px;
    font-size: 15px;
  }

  body#my-account .links .link-item i,
  body#my-account .links .link-item .material-icons,
  body#my-account .links .link-item .material-icons-outlined,
  body#my-account .links .link-item [class^="fa-"],
  body#my-account .links .link-item [class*=" fa-"] {
    width: 68px;
    height: 68px;
    min-width: 68px;
    flex-basis: 68px;
    font-size: 31px !important;
  }
}

/* Mobile: 1 card per riga */
@media (max-width: 575.98px) {
  body#authentication .page-content,
  body#registration .page-content {
    padding: 18px;
  }

  body#my-account .page-header h1,
  body#my-account h1.h1,
  body#my-account .page-title {
    font-size: 32px;
    margin-bottom: 22px;
  }

  body#my-account .links {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  body#my-account .links .link-item {
    min-height: 168px;
    padding: 24px 44px 24px 24px;
    font-size: 15px;
  }

  body#my-account .links .link-item i,
  body#my-account .links .link-item .material-icons,
  body#my-account .links .link-item .material-icons-outlined,
  body#my-account .links .link-item [class^="fa-"],
  body#my-account .links .link-item [class*=" fa-"] {
    width: 64px;
    height: 64px;
    min-width: 64px;
    flex-basis: 64px;
    font-size: 29px !important;
  }

  body#my-account .links .link-item::after {
    right: 18px;
  }
}