/* Área do cliente (/conta) — login, cadastro, recuperar senha e painel */

main#conta{--conta-teal: #034A5D; --conta-card: rgba(232, 232, 232, 1); --conta-text: rgba(3, 74, 93, 1); padding: 24px 0 64px; overflow: visible;}
main#conta #acc{width: 1080px; max-width: 90vw; margin: auto;}

/* Banner herdado do tema antigo (imagem inexistente) */
main#conta .about{display: none;}

/* ---------- Cartão dos formulários públicos ---------- */

main#conta #login{display: flex; justify-content: center;}

main#conta form[name="account_form"].column,
main#conta .login_box{width: 100%; max-width: 480px; margin: 0 auto; padding: 40px 32px; background: var(--conta-card); border-radius: 24px; color: var(--conta-text); gap: 16px; box-shadow: none;}

main#conta form[name="account_form"] h3,
main#conta .login_box header h1{font-family: 'High Voltage Rough', sans-serif; font-weight: 400; font-size: 2.5rem; line-height: 1; color: var(--main-color); text-align: center;}
main#conta form[name="account_form"] > p,
main#conta .login_box header p{font-size: 0.875rem; text-align: center; text-transform: none; font-weight: 400; color: var(--conta-text);}

main#conta .login_box header{padding: 0 0 8px; background: transparent; text-align: center;}
main#conta .login_box form[name="account_form"]{max-width: none; padding: 0; background: transparent; border-radius: 0;}

main#conta .inputArea{gap: 10px;}
main#conta form[name="account_form"] :is(input:not([type="hidden"]), select){padding: 14px 16px; background-color: #fff; border: 1px solid rgba(3, 74, 93, 0.35); border-radius: 16px; color: var(--conta-text); font-size: 0.9375rem; transition: border-color .2s, box-shadow .2s;}
main#conta form[name="account_form"] :is(input, select):focus{outline: none; border-color: var(--conta-teal); box-shadow: 0 0 0 3px rgba(3, 74, 93, 0.15);}
main#conta form[name="account_form"] select{font-weight: 400;}
main#conta form[name="account_form"] input::placeholder{color: rgba(3, 74, 93, 0.6); font-weight: 400;}

main#conta .inputArea > a,
main#conta form[name="account_form"] > a,
main#conta .account_form_actions a{font-size: 0.875rem; color: var(--conta-teal); text-align: center; text-decoration: underline; text-underline-offset: 3px;}
main#conta .inputArea > a{text-align: right; margin-top: -2px;}
main#conta form[name="account_form"] > a:hover,
main#conta .inputArea > a:hover{color: var(--main-color);}

main#conta form[name="account_form"] .btn{width: 100%; padding: 14px 24px; background-color: var(--conta-teal); border-radius: 16px; font-weight: 700; font-family: 'ITC Avant Garde', sans-serif; font-size: 1rem; color: #fff; cursor: pointer; transition: background-color .2s;}
main#conta form[name="account_form"] .btn:hover{background-color: var(--main-color);}
main#conta form[name="account_form"] .btn:focus-visible{outline: 3px solid rgba(3, 74, 93, 0.4); outline-offset: 2px;}

main#conta .form_img{display: none; width: 26px; height: 26px; margin: -8px auto 0;}

/* Formulário de nova senha (labels + bloco de ações) */
main#conta .account_form_fields{display: flex; flex-direction: column; gap: 12px; padding: 0;}
main#conta .account_form_fields label{display: flex; flex-direction: column; gap: 6px; margin: 0;}
main#conta .account_form_fields label span{font-size: 0.875rem; color: var(--conta-text);}
main#conta .account_form_actions{display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 16px 0 0; background: transparent;}
main#conta .account_form_actions img{display: none; width: 26px;}
main#conta .account_form_actions > div{display: none;}

/* ---------- Mensagens (retorno do AJAX) ---------- */

main#conta .account_form_callback:empty{display: none;}
main#conta .trigger{position: relative; padding: 12px 36px 12px 16px; border-radius: 12px; font-size: 0.875rem; line-height: 1.4; text-align: left; background: #e8f4f8; color: var(--conta-text); border-left: 4px solid var(--conta-teal);}
main#conta .trigger a{font-weight: 700; text-decoration: underline; color: inherit;}
main#conta .trigger_success{background: #e7f6ec; color: #1e6b3a; border-color: #2e9d57;}
main#conta .trigger_alert{background: #fff6e0; color: #7a5300; border-color: #e0a100;}
main#conta .trigger_error{background: #fdecec; color: #9b2222; border-color: #d23c3c;}
main#conta .trigger .ajax_close{position: absolute; top: 10px; right: 12px; width: 14px; height: 14px; cursor: pointer; opacity: .6;}
main#conta .trigger .ajax_close:before{content: '\00d7'; font-size: 1.2rem; line-height: 14px;}

/* ---------- Painel logado ---------- */

main#conta #acc:has(.workcontrol_account_sidebar){display: grid; grid-template-columns: 280px 1fr; gap: 24px; align-items: start;}

main#conta .workcontrol_account_sidebar{width: auto; padding: 0; background: var(--conta-card); border-radius: 24px; overflow: hidden;}
main#conta .workcontrol_account_sidebar header{padding: 24px 20px; background: var(--conta-teal); text-align: left;}
main#conta .workcontrol_account_sidebar header h1{font-family: 'ITC Avant Garde', sans-serif; font-size: 1.125rem; font-weight: 700; color: #fff;}
main#conta .workcontrol_account_sidebar header p{font-size: 0.8125rem; color: rgba(255, 255, 255, .8); word-break: break-all;}
main#conta .workcontrol_account_sidebar_nav{padding: 8px; margin: 0; list-style: none; background: transparent;}
main#conta nav.workcontrol_account_sidebar_nav{padding: 0;}
main#conta .workcontrol_account_sidebar_nav li{width: 100%; border: 0;}
main#conta .workcontrol_account_sidebar_nav li a{display: block; padding: 12px 14px; border-radius: 12px; font-size: 0.875rem; font-weight: 700; text-transform: none; color: var(--conta-text);}
main#conta .workcontrol_account_sidebar_nav li a:before{content: none;}
main#conta .workcontrol_account_sidebar_nav li a:hover{background: rgba(255, 255, 255, .6);}
main#conta .workcontrol_account_sidebar_nav li .active,
main#conta .workcontrol_account_sidebar_nav li .active:hover{background: #fff; color: var(--main-color); cursor: default;}
main#conta .workcontrol_account_sidebar_nav li .logoff{color: #b42f2f;}

main#conta .account_box{display: block; width: auto; min-width: 0; padding: 32px; background: var(--conta-card); border-radius: 24px; color: var(--conta-text);}
main#conta .workcontrol_account_view{padding: 0;}
main#conta .wc_account_title{margin-bottom: 20px; padding: 0; border: 0; font-family: 'High Voltage Rough', sans-serif; font-size: 2rem; font-weight: 400; text-transform: none; color: var(--main-color);}
main#conta .wc_account_title span{padding: 0; border: 0;}
main#conta .wc_spacer{margin: 24px 0; padding: 0; height: 1px; background: rgba(3, 74, 93, .15);}
main#conta .workcontrol_account_home{display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px;}
main#conta .workcontrol_account_home p{width: auto; padding: 12px 14px; background: #fff; border: 0; border-radius: 12px; color: var(--conta-text); font-size: 0.9375rem;}
main#conta .workcontrol_account_home p b{display: block; font-size: 0.75rem; font-weight: 400; color: rgba(3, 74, 93, .65);}

main#conta .wc_account_order{padding: 14px 0; border-bottom: 1px solid rgba(3, 74, 93, .15); font-size: 0.875rem;}
main#conta .wc_account_order p{color: var(--conta-text);}
main#conta .wc_account_order a{color: var(--conta-teal); font-weight: 700;}

/* Pedidos */
main#conta .acc_btn{display: inline-flex; align-items: center; justify-content: center; padding: 12px 22px; border-radius: 16px; background: var(--conta-teal); color: #fff; font-weight: 700; font-size: 0.9375rem; transition: background-color .2s, color .2s;}
main#conta .acc_btn:hover{background: var(--main-color);}
main#conta .acc_btn_outline{background: transparent; color: var(--conta-teal); border: 1px solid var(--conta-teal);}
main#conta .acc_btn_outline:hover{background: var(--conta-teal); color: #fff;}

main#conta .acc_status{flex-shrink: 0; padding: 6px 12px; border-radius: 999px; font-size: 0.75rem; font-weight: 700; white-space: nowrap;}
main#conta .acc_status_paid{background: #e7f6ec; color: #1e6b3a;}
main#conta .acc_status_pending{background: #fff6e0; color: #7a5300;}
main#conta .acc_status_canceled,
main#conta .acc_status_expired{background: #f1f1f1; color: #6b6b6b;}

main#conta .acc_empty{display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 20px; background: #fff; border-radius: 16px;}

main#conta .acc_orders{display: flex; flex-direction: column; gap: 12px;}
main#conta .acc_order{display: flex; flex-direction: column; gap: 14px; padding: 20px; background: #fff; border-radius: 16px;}
main#conta .acc_order_actions{display: flex; flex-wrap: wrap; gap: 10px;}
main#conta .acc_order_head{display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;}
main#conta .acc_order_head h3{font-family: 'ITC Avant Garde', sans-serif; font-size: 1.125rem; font-weight: 700; color: var(--main-color);}
main#conta .acc_order_head p{font-size: 0.8125rem; color: rgba(3, 74, 93, .7); margin-top: 4px;}
main#conta .acc_order_info{display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px 16px;}
main#conta .acc_order_info dt{font-size: 0.75rem; color: rgba(3, 74, 93, .65);}
main#conta .acc_order_info dd{margin: 2px 0 0; font-size: 0.9375rem; font-weight: 700; color: var(--conta-text);}
main#conta .acc_order_info .acc_total{font-size: 1.25rem;}

main#conta .acc_recent{display: flex; flex-direction: column; gap: 8px; margin: 0 0 14px; padding: 0; list-style: none;}
main#conta .acc_recent a{display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 16px; background: #fff; border-radius: 14px; transition: box-shadow .2s;}
main#conta .acc_recent a:hover{box-shadow: 0 0 0 2px var(--conta-teal);}
main#conta .acc_recent_title{display: flex; flex-direction: column; gap: 2px; min-width: 0;}
main#conta .acc_recent_title b{color: var(--main-color);}
main#conta .acc_recent_title small{font-size: 0.8125rem; color: rgba(3, 74, 93, .7);}

main#conta .acc_order_detail{display: flex; flex-direction: column; gap: 18px;}
main#conta .acc_order_detail .wc_account_title{margin: 0;}
main#conta .acc_back{align-self: flex-start; font-size: 0.875rem; color: var(--conta-teal); text-decoration: underline; text-underline-offset: 3px;}
main#conta .acc_actions{display: flex; flex-wrap: wrap; gap: 10px;}
main#conta .acc_actions:empty{display: none;}
main#conta .acc_section{padding: 20px; background: #fff; border-radius: 16px;}
main#conta .acc_section h3{margin-bottom: 12px; font-family: 'ITC Avant Garde', sans-serif; font-size: 1rem; font-weight: 700; color: var(--main-color);}
main#conta .acc_travelers{margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 8px;}
main#conta .acc_travelers li span{display: block; font-size: 0.8125rem; color: rgba(3, 74, 93, .7);}
main#conta .acc_inclusos{margin: 0; padding-left: 20px; display: grid; gap: 6px;}

main#conta .paginator{display: flex; justify-content: center; gap: 6px; margin-top: 16px;}

/* Callback do painel: toast fixo no topo */
main#conta .account_box .account_form_callback{position: fixed; top: 16px; right: 16px; z-index: 50; width: 420px; max-width: calc(100vw - 32px); padding: 0;}

@media (max-width: 62em){
	main#conta #acc:has(.workcontrol_account_sidebar){grid-template-columns: 1fr;}
	main#conta ul.workcontrol_account_sidebar_nav{display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px;}
	main#conta .workcontrol_account_sidebar_nav li{display: block; width: auto;}
}

@media (max-width: 42em){
	main#conta form[name="account_form"].column,
	main#conta .login_box{padding: 32px 20px;}
	main#conta .account_box{padding: 24px 16px;}
	main#conta .workcontrol_account_home{grid-template-columns: 1fr;}
	main#conta .acc_order_head{flex-direction: column;}
	main#conta .acc_recent a{flex-direction: column; align-items: flex-start;}
	main#conta .acc_actions .acc_btn{flex: 1 1 100%;}
}